跟踪对象属性值的修改, 设置断点(Break on property change)

• 代码
  • 　　

    //Break on property change
    (function () {
        var localValue;
    
        Object.defineProperty(targetObject, 'propertyName', {
            get: function() { //any access to the target property will call this method
                return localValue;
            },
            set: function(val) { //any modification to the target property will call this method
                debugger;
                localValue = val;
            }
        });
    }());

     

• Object.defineProperty
  • reference
    • segmentfault: 
      • 使用 Object.defineProperty
      • 解析神奇的 Object.defineProperty
    • MDN: Object.defineProperty()
  • Object.defineProperty是ECS5属性，所以IE8以下无效
  • 实际应用例子
    
    • 数据双向绑定
      • 　　

        Object.defineProperty(demo,'foobar',{
          get:function(){
            return v;
          },
          set:function(e){
            v = e;
            sow();
          }}
        );
        
        function sow(){
           $('body').html(demo.foobar) 
        }

         

    • 手动设置断点
    • 设置属性不可变
    • 移除属性
      • 　　

        get: function () {
              throw new Error('Most middleware (like ' + name + ') is no longer bundled with Express and must be installed separately. Please see https://github.com/senchalabs/connect#middleware.');
            }

         

• debugger
  • reference: MDN - debugger