我有下面的代理处理程序来记录get事件。
const proxyHandler = {
get: function(target, prop) {
console.log("get", prop);
return Reflect.get(target, prop);
}
};
const obj = new Proxy(
{
value: 4,
text: "hi",
get textVal() {
return this.text.repeat(this.value);
},
getTextVal() {
return this.text.repeat(this.value);
}
},
proxyHandler
);
console.log("------- normal func -------")
console.log(obj.getTextVal());
console.log("------- getter func -------")
console.log(obj.textVal);
当我记录console.log(obj.getTextVal())
时,我得到:
get getTextVal
get text
get value
hihihihi
但是当我记录getter console.log(obj.textVal)
时,我只得到以下内容:
get textVal
hihihihi
如何让obj.textVal
记录get text
并使用代理获取get value
事件?当运行console.log(obj.textVal)
时,我希望得到以下结果。
get getTextVal
get text
get value
hihihihi
2条答案
按热度按时间ru9i0ody1#
上面的答案是可行的,但还有一个更优雅的解决方案。您在代理陷阱和反射参数中缺少
receiver
。只需将代理更改为:注意trap和Reflect参数中的新
receiver
。代理陷阱
target
和receiver
之间有一个重要的区别。在本例中,target
是底层原始对象,而receiver
是代理 Package 器。如果你没有将receiver
传递给Reflect调用,get
操作中的所有内容都将针对原始对象运行,并且不会触发代理陷阱。如果你有时间,我建议你阅读ES6规范的相关部分,以充分掌握这两者之间的区别。否则,只要确保将allProxy trap参数转发到匹配的Reflect调用(如果您的目标是透明 Package )。
mctunoxg2#
您可以将
Proxy
示例设置为proxyHandler
对象,并通过它访问属性(而不是this
)。更新:
或者,您也可以创建一个自定义的
Proxy
来完成同样的工作,该Proxy
为您执行赋值操作(Note:
Proxy
类不能被扩展,但我们可以使用constructor return value模式):