vue数据监测原理(观察订阅者模式)

113 阅读1分钟

1.监测对象变化的原理

    let data = {
            name:'张三',
            age:18
        }
     
   // 创建一个监测的实例对象,用于监听data中属性的变化
   const obs = new Observer(data)
   
   let vm = {};
   vm._data = data = obs;
   
   function Observer(obj){
       // 对象中所有的属性
       const keys = Object.keys(obj)
       // 遍历
       keys.forEach((k)=>{
           Object.defineproperty(this,k,{
               get(){
                   return obj[k]
               },
               set(value){
                   obj[k] = value
               }
           })
       })
       
   }