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

Question

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

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

我知道这是一个老问题，但如果你是为了调试这样建议，您可以添加使用debugging tool at your browser相同的方式，调试脚本的监听器。

个人，我在Firefox中使用Firebug，一旦打开，去DOM标签，搜索你的变量，那么（类似于增加一个断点脚本）添加breakpoints。它会中断并滚动到将要处理变量变化的特定代码行。

检查了这一点 - >火狐FIREBUG或谷歌浏览DEVELOPER TOOL

Answer 3

如果你想断火的事件当一个对象变量的变化，您可以设置为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方法，然后一个通知事件触发关闭到是看它的其他对象。

JS FIDDLE