vue.js响应式原理解析与实现

Object.defineProperty

es5新增了Object.defineProperty这个api,它可以让我们为对象的属性来设定getter和setter,从而我们可以劫持用户对对象属性的取值和赋值。比如以下代码:

const obj = {};
let val ='cjg';
Object.defineProperty(obj,'name',{ 
  get(){
    console.log('劫持了你的取值操作啦');   
    return val;
    },  
  set(newVal){
    console.log('劫持了你的赋值操作啦');
    val =newVal;
  }
});
console.log(obj.name);
obj.name ='cwc';
console.log(obj.name);

未完待续

你可能感兴趣的:(vue.js响应式原理解析与实现)