Is there Proxy-object polyfill available google chrome? Is there Proxy-object polyfill available google chrome? google-chrome google-chrome

Is there Proxy-object polyfill available google chrome?


You could use Object.defineProperty and Object.observe to to simulate a Proxy. I started to wonder how much functionality a polyfill could support, so I wrote an implementation (you can see it at gist.github.com/mailmindlin/640e9d707ae3bd666d70).I was able to emulate all of the features of Proxy that didn't rely on operator overloading, whic isn't possible in JavaScript as of now.

However, you can get the get, set, and a few others working. You can use getters and setters to mirror the target object's properties:

for (var property in target)    Object.defineProperty(proxy, property, {        get: function() {            if ('get' in handler)                return handler.get(target, property, proxy);            else                return target[property];       },       set: function(value) {           if ('set' in handler)               handler.set(target, property, value, proxy);           else               target[property] = value;      }});

The only problem with that is that the getters and setters only apply to properties that were defined in for the target when the proxy was initialized, and the delete operator won't work (If you delete a property on the target object, the proxy will still enumerate it as a property; if you delete a property on the proxy, nothing will happen to the object).

To fix that, you can use Object.observe which will be called on any change to either object. A quick check on caniuse.com shows that Object.observe is available on Chrome and Opera. If you really need support for Proxy on another browser, you can poll the target and proxy objects, to check if any properties have been created or destroyed:

var oldKeys = Object.keys(proxy);setInterval(function() {    var keys = Object.keys(proxy);    for(var i in keys)        if(!oldKeys.includes(keys[i]))            //Trigger code for a new property added    for(var i in oldKeys)        if(!keys.includes(oldKeys[i]))            //trigger code for a deleted property    oldKeys = keys;    //repeat for target object}, 100);

If you desperately need more features of the proxy, you can try overriding methods such as Object.defineProperty and Object.getOwnPropertyDescriptor, but that might create compatibility issues with other scripts, depending on how you do it.

In short, you can do most of what you'll probably need to use Proxy for with a polyfill. As far as Google adding it to their browser, I have no idea. It apparently used to be part of the V8 engine, but it was removed because of security problems (that nobody elaborates on), as far as I could tell based on this thread.


I have created babel plugin whic allows you to do this but it comes with huge performance impact (for each property access) - it is more education example.

https://github.com/krzkaczor/babel-plugin-proxy


Here is one created by the Google Chrome team:https://github.com/GoogleChrome/proxy-polyfill

It's not a full implementation, though.