首先有一个data,
data={
name:"shuaige",
age:19,
female:"man"
}
要实现对data的修改就能即时相应,需要用到Object.defineProperty.
一、Object.defineProperty的使用
Object.defineProperty(obj,prop,descriptor)
其中obj为处理的对象,prop为需要定义或修改的属性,descriptor为属性描述符
属性描述符
configurable:ture; 属性是可以配置的,可多次通过Object.defineProperty去修改属性,且可以删除 enumerable:true; 属性可枚举的
此外,还有数据描述符和存取描述符,两者不可同时存在
数据描述符
value:xxx 设置属性的值 writable: true 可以修改属性的值
存取描述符
设置计算属性 get:function(){return xxx} //返回值会作为属性值 set:function(val){} //默认一个参数,将新参数给这个属性
二、数据的劫持
function observe(data){
if(!data || typeof data !=="object") return;
for(let key in data){
let value=data[key];
Object.defineProperty(data,key,{
configurable:true,
enumerable:true,
get:function(){
console.log(`get${value}`);
return value;
},
set:function(newVal){
console.log(`${value}=>${newVal}`);
value=newVal;
}
})
if(typeof value=== "object") observe(value);
}
}