2018-01-31 数据劫持

数据劫持 关键点运用Object.defineProperty()函数

function observer(data){
  if(!data || typeof data !== 'object'){
    return;
  }
  // Object.keys遍历对象的属性，不包含原型链上的属性
  Object.keys(data).forEach(key => {
    observerProperty(data, key, data[key]);
  })
}

function observerProperty(data, key, val){
  // 递归
  observer(val);
  Object.defineProperty(data, key, {
    enumerable: true,  // 可以枚举
    configrable: true,   // 可重新定义
    get: function(){
      return val;
    },
    set: function(newVal){
      if(val === newVal){
        return;
      }
      console.log("数据更新啦", val, "=>", newVal);
      val = newVal;
    }
  })
}

var person = {name: "Lucy"};
observer(person);
person.name="Mary";
//输出：数据更新啦 lucy => Mary