我可以代理window
对象来检测更改吗?我尝试了以下方法,但没有任何运气:
var handler = {
get: function(target, property) {
console.log("getting " + property + " for " + target);
return target[property];
},
set: function(target, property, value, receiver) {
console.log("setting " + property + " for " + target + " with value " + value);
target[property] = value;
return true;
},
};
var p = new Proxy(window, handler);
setTimeout(() => {
window.a = 10; // expecting a log, but nothing...
}, 3000);
setTimeout(() => {
window.c = 20; // expecting a log, but nothing...
}, 4000);
您必须在较低的代码中引用代理实例,而不是window
:
var handler = {
get: function(target, property) {
console.log("getting " + property + " for " + target);
return target[property];
},
set: function(target, property, value, receiver) {
console.log("setting " + property + " for " + target + " with value " + value);
target[property] = value;
return true;
},
};
var p = new Proxy(window, handler);
setTimeout(() => {
p.a = 10; // <------------
}, 300);
setTimeout(() => {
p.c = 20; // <------------
}, 400);
如果您无法更改引用window
的代码,您也可以将代理命名为window
(并将对 true 窗口的引用保存在另一个变量中(,但该代码看起来会令人困惑。
如果它在独立的脚本文件中,上述技巧将不起作用,并且您将无法使用Proxy
- 毕竟您无法重新定义窗口对象。如果要在 window
上查找特定属性的更改,则可以使用 defineProperty
并让资源库在分配给以下位置时用新值覆盖属性描述符:
Object.defineProperty(window, 'a', {
configurable: true,
set(value) {
console.log("setting with value " + value);
Object.defineProperty(window, 'a', { value });
}
});
setTimeout(() => {
window.a = 10;
console.log(window.a);
}, 300);