// 是通过proxy把目标对象变成代理对象,然后通过Reflect把值返回回来的操作,将数据变成响应式
// 常用的Reflect方法有 get、set、deleteProperty
const user = {
name: '佐助',
age: 20,
like: {
name: '小樱',
age: 19
}
}
// 两个参数
// 参数1:目标对象,参数2:处理器对象,是不可构造的
const proxy = new Proxy(user, {
// 访问时触发
get(target, prop) {
console.log("get方法被触发");
return Reflect.get(target, prop)
},
// 修改值或者添加值时触发
set(target, prop, val) {
console.log("set方法被触发");
return Reflect.set(target, prop, val)
},
// 删除对象上面的某个属性(深度的)
deleteProperty(target, prop) {
console.log("deleteProperty方法被触发");
return Reflect.deleteProperty(target, prop)
}
})
// 触发get方法 为undefined,要通过 Reflect把值反射回来
console.log(proxy.name);
// 触发set方法 并没有修改值要通过 Reflect把值反射回来(通过代理对象更新目标对象的某个属性值)
proxy.name = '鸣人'
console.log(proxy);
// 向目标对象中添加一个属性(也是触发set方法)
proxy.sex = "男"
console.log(proxy);
// 删除对象上面的属性
delete proxy.sex
delete proxy.like.age // 深度的,删除like.age也是可以删除的
console.log(proxy);