classObserver{constructor(data){this.walk(data)}// 遍历 data 对象的所有属性walk(data){// 1. 判断 data 是否是对象if(!data ||typeof data !=='object'){return}// 2. 遍历 data 对象的所有属性
Object.keys(data).forEach(key =>{this.defineReactive(data, key, data[key])})}defineReactive(obj, key, val){let that =this// 负责收集依赖,并发送通知let dep =newDep()// 如果 val 是对象,把 val 内部的属性转换成响应式数据this.walk(val)
Object.defineProperty(obj, key,{
enumerable:true,// 可枚举
configurable:true,// 可配置get(){// 收集依赖
Dep.target && dep.addSub(Dep.target)return val
},set(newValue){// 数据没有发生变化 return 停止执行if(newValue === val){return}
val = newValue
// 使新设置的值也拥有 get 和 set 方法
that.walk(newValue)// 发送通知
dep.notify()}})}}