break-on-access icon indicating copy to clipboard operation
break-on-access copied to clipboard

Implement with Proxies

Open paulirish opened this issue 8 years ago • 5 comments

ES6 Proxies could be used to pull off the same technique. It perhaps could have a few advantages over using getters.

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy

They're now in most browsers: image

paulirish avatar Feb 17 '16 19:02 paulirish

:+1:

sktguha avatar Mar 01 '16 11:03 sktguha

Any help is appreciated!

paulirish avatar Mar 01 '16 19:03 paulirish

@paulirish Not sure it is possible in general case -- doesn't Proxy have to be a separate object? So it wouldn't help if you want to watch an object already referenced somewhere.

ashmind avatar Mar 01 '16 20:03 ashmind

@ashmind yeah true. the workflow is a little different.

I suppose we could do something like

Object.prototype.debug = function(){

var interceptor = {
  set: function (receiver, property, value) {
    console.trace(property, 'is changed to', value);
    // debugger
    receiver[property] = value;
  }
};

return new Proxy(this, interceptor);
}

which could enable creating the debuggable object at assignment:

this.latLon = app.getLon().debug();

.... oh look at that, somebody already wrote this: check tracePropAccess in http://www.2ality.com/2014/12/es6-proxies.html

paulirish avatar Mar 02 '16 00:03 paulirish

I suppose one benefit is that you can watch any properties, not just specified ones.

paulirish avatar Mar 02 '16 00:03 paulirish