vardata={name:"fangtangxiansheng",job:"fe",power:0};console.log(data);lettarget=null;classwillObserver{watchList=[];//添加观察者addWatch(){target&&(this.watchList=[...newSet([...this.watchList,target])]);}watchUpdate(){这个。监视列表。forEach((watch)=>{watch.update();});}//通知notiy(){this.watchUpdate();}}classWatch{constructor(cb){this.cb=cb;目标=这个;}update(){this.cb();}}constcreatWatch=(expCondition,cb)=>{newWatch(cb);expCondition();};//构造“数据依赖埋点”consttrasnfromDataToAutoListion=(data)=>{Object.keys(data).forEach((key)=>{letcache=data[key];let_ob=newwillObserver();Object.defineProperty(data,key,{//触发监视实例更新set(v){cache=v;_ob.notiy();},//做一些隐藏的get(){_ob.addWatch();返回缓存;}});});};trasnfromDataToAutoListion(data);creatWatch(()=>{console.log("condition",data.name,data.job);},()=>{document.querySelector("#html").innerHTML=JSON。stringify(数据);});document.querySelector("#html").innerHTML=JSON.stringify(数据);setInterval(()=>{data.power=`${Math.random()*100}%`;},500);演示
