Proxy
可以监听到对象中的对象的引用。
当使用Proxy
包装一个对象时,可以为该对象的任何属性创建一个拦截器,包括属性值为对象的情况。
下面展示了如何使用Proxy
来监听对象中对象引用的变化:
const obj = {
nestedObj: { foo: "bar" },
};
const handler = {
get(target, prop, receiver) {
const value = Reflect.get(target, prop, receiver);
if (typeof value === "object" && value !== null) {
return new Proxy(value, handler);
}
console.log("get", prop, target[prop]);
return value;
},
set(target, property, value) {
target[property] = value;
console.log(`Setting property '${property}' to '${value}'`);
return true;
},
};
const proxyObj = new Proxy(obj, handler);
proxyObj.nestedObj.foo = "baz"; // 输出: Setting property 'foo' to 'baz'
我们通过Proxy
创建了一个代理对象proxyObj
,它包装了原始的obj
。然后,我们对proxyObj
中的nestedObj.foo
进行赋值操作,这会触发set
拦截器,并打印相应的信息。
通过使用适当的拦截器函数,可以实现对对象中对象引用的监听和修改。这使得我们可以在需要时执行自定义的操作,例如记录更改、验证或触发其他事件等。