ES6 Proxy Function Call Trap

Edwin Reynoso eorroe at gmail.com
Thu Jun 11 12:10:42 UTC 2015


Ok so I got it work with the following code:

```
function Person(fName, lName, age) {
this.firstName = fName;
this.lastName  = lName;
this.age       = age;
}

Person.prototype = {
logFullName() {
console.log(this.firstName, this.lastName);
},

getAge() {
return this.age;
}
}

var people = new Proxy([new Person('Edwin', 'Reynoso', 16), new
Person('That', 'Guy', 1000)], {
get(target, property) {
if(target[property] !== undefined) return target[property];
var arr = [];
for(var person of target) {
if(person[property].constructor === Function) {
return function(...args) {
for(var person of target) {
if(person[property]) arr.push(person[property](...args));
}
return arr;
}
} else if(person[property]) {
if(person[property]) arr.push(person[property]);
} else {
throw Error(property + ' is not defined');
}
}
return arr;
}
});
```

However I still believe there should be an `invoke` trap in ES6 proxies.

First here's what it would look like:

```
var people = new Proxy([new Person('Edwin', 'Reynoso', 16), new
Person('That', 'Guy', 1000)], {
get(target, property) {
if(target[property] !== undefined) return target[property];
var arr = [];
for(var person of target) {
if(person[property]) arr.push(person[property]);
}
return arr;
},
invoke(target, functionName, arguments) {
if(target[functionName]) target[functionName](...arguments);
var arr = [];
for(var person of target) {
if(person[functionName]) arr.push(person[functionName](...args));
}
return arr;
}
});
```

Now isn't that much easier to read and write?

Why have the `handler.get` trap do all the work.

IMHO It's almost like saying only have one event listener for each
type("click") for each element:

```
document.body.onclick = function() {
// handle first thing
// handle second thing
// handle third thing
}
```

The above could get really complicated

Over having the following:

```
document.body.addEventListener('click', function() {
// handle first thing
});

document.body.addEventListener('click', function() {
// handle second thing
}

document.body.addEventListener('click', function() {
// handle third thing
}
```

So why not do that for ES6 proxies as well by adding an `invoke` trap.

If someone could give me a really good reason for why this is a bad idea,
please do. I'm open minded.

On Tue, Jun 9, 2015 at 3:33 PM, Tom Van Cutsem <tomvc.be at gmail.com> wrote:

> Edwin,
>
> The "call" trap you suggest has been suggested numerous times before (by
> the name of the "invoke" trap) and was nearly added to the spec at one
> point, but eventually removed because of a number of reasons, the more
> important one being that it breaks the equivalence that a method call in JS
> is nothing but a property access followed by a function call.
>
> The suggestion made by Claude has nothing to do with Reflect, and you
> don't necessarily need Reflect to implement it: |Reflect.apply(fun,
> thisArg, args)| is equivalent to |Function.prototype.apply.call(fun,
> thisArg, args)|, it's just shorter and more idiomatic.
>
> The important thing is to return, from your `get` trap, another Proxy that
> implements the `apply` trap to be able to intercept the subsequent method
> call.
>
> Cheers,
> Tom
>
> 2015-06-09 17:25 GMT+02:00 Jason Orendorff <jason.orendorff at gmail.com>:
>
>> On Tue, Jun 9, 2015 at 3:44 AM, Edwin Reynoso <eorroe at gmail.com> wrote:
>> > Alright first I'll say I'm using FF to test because FF supports
>> proxies, and
>> > I really don't know how to use Reflect and how it works yet. FF as well
>> does
>> > not support Reflect right now. Therefore I'll look into that.
>>
>> That's right. Reflect is a key tool when you're writing proxy
>> handlers. I'm working on implementing it in Firefox now. If you like,
>> you can subscribe to this bug and get updates (quiet so far):
>> https://bugzilla.mozilla.org/show_bug.cgi?id=987514
>>
>> Here, I think the technique you're looking for might be that the proxy
>> handler's get() method should return a new proxy (representing an
>> array of methods). This new "method proxy" needs something callable as
>> its target. When the method proxy's .call() trap is called, it'll
>> receive the arguments.
>>
>> -j
>> _______________________________________________
>> es-discuss mailing list
>> es-discuss at mozilla.org
>> https://mail.mozilla.org/listinfo/es-discuss
>>
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.mozilla.org/pipermail/es-discuss/attachments/20150611/b56b7ca7/attachment.html>


More information about the es-discuss mailing list