javascript事件监听器，用于更改对象变量

我有一个具有多个属性的对象变量。

MyVar = {"prop1" : 0, "prop2": 0....}; 

如何编写侦听任何属性更改的事件侦听器。

谢谢你的建议。

Answer 1

使用ES5，您可以设置：

 var MyVar = { _prop1: 0, get prop1() { return this._prop1; }, set prop1(value) { this._prop1 = value; /*Listener code can go here*/ } }; 

Answer 2

如果要在对象变量更改时触发事件，可以为该obj设置一个小的Observer模式。

 var MyVar = { prop1: "Foo", prop2: "Bar", events: {}, setProp1: function(prop1) { this.prop1 = prop1; this.notify('prop1', this.prop1); }, setProp2: function(prop2) { this.prop2 = prop2; this.notify('prop2', this.prop1); }, addEvent: function(name) { if (typeof this.events[name] === "undefined") { this.events[name] = []; } }, register: function(event, subscriber) { if (typeof subscriber === "object" && typeof subscriber.notify === 'function') { this.addEvent(event); this.events[event].push(subscriber); } }, notify: function(event, data) { var events = this.events[event]; for (var e in events) { events[e].notify(data); } } }; var Prop1 = { notify: function() { alert('prop1 changed'); } }; var Prop2 = { notify: function() { alert('prop2 changed'); } }; $(document).ready(function(){ MyVar.register('prop1',Prop1); MyVar.register('prop2',Prop2); MyVar.setProp1('New Var'); MyVar.setProp2('New Var'); }); 

用法而不是直接设置对象属性，您使用setter方法，然后将一个notify事件触发到正在观看它的其他对象。

JS FIDDLE

Answer 3

我知道这是一个老问题，但是如果你这样做是为了调试建议，你可以debugging tool at your browser使用debugging tool at your browser添加一个监听debugging tool at your browser就像调试脚本一样。

我个人在Firefox中使用Firebug ，一旦打开，转到DOM选项卡，搜索变量，然后（ 类似于向脚本添加breakpoints ）添加breakpoints 。 它将中断并滚动到将处理变量更改的特定代码行。

看看这个 – > Firefox FIREBUG或谷歌Chrome 开发工具