javascript-实例化对象时使用代理陷阱

Question

I would like to have a javascript function that I can instantiate, and catch every undefined method that is being called to it (Proxy Trap).

What I have so far is this:

var MyProxyFunction = new Proxy(function () {
        console.log(">>>>>>>>>>>>>>>>>>>> constructor");
    }, {
    get: function(target, prop) {
        if (target[prop] === undefined) {
            return function()  {
                console.log('an otherwise undefined function!!');
            };
        }
        else {
            return target[prop];
        }
    }
});

Now, if I call MyProxyFunction.foo() , it will get called (I will see the "constructor" firing off and the log from the get function).

But what I would like to do is have this object instantiated (and do some initialization in the constructor) like this:

var myObj = new MyProxyFunction();
myObj.foo();

But when I do that than I get that foo() is not a function. Why? and how can I make it work when instantiating the proxy?

Answer 1

The explanation for that behaviour is that your constructor is proxied, but not the objects it constructs. So when you write new MyProxyFunction the proxied constructor is called, but the constructor creates a new object which has nothing to do with Proxy , but with the prototype property of the constructor.

There are several ways to make it work.

1. Apply the proxy on the prototype object

 function MyProxyFunction() { console.log(">>>>>>>>>>>>>>>>>>>> constructor"); }; MyProxyFunction.prototype = new Proxy(MyProxyFunction.prototype, { get: function(target, prop) { if (target[prop] === undefined) { return function() { console.log('an otherwise undefined function!!'); }; } else { return target[prop]; } } }); var myObj = new MyProxyFunction(); myObj.foo(); console.log('constructor:', myObj.constructor.name); console.log('Is instance of MyProxyFunction?: ', myObj instanceof MyProxyFunction); 

It now looks a bit strange to use the name MyProxyFunction , as it is not the function (the constructor) itself that is proxied.

2. Create a proxy for each instance

If you want to have a constructor that creates a new proxy each time you instantiate an object with it, then don't assign new Proxy directly to MyProxyFunction , but make it a plain constructor function that returns a new Proxy .

The object you then have to proxy is this .

 function MyProxyFunction() { console.log(">>>>>>>>>>>>>>>>>>>> constructor"); return new Proxy(this, { get: function(target, prop) { if (target[prop] === undefined) { return function() { console.log('an otherwise undefined function!!'); }; } else { return target[prop]; } } }); } var myObj = new MyProxyFunction(); myObj.foo(); console.log('constructor:', myObj.constructor.name); console.log('Is instance of MyProxyFunction?: ', myObj instanceof MyProxyFunction);