如何通过回调观察 window.variable 的变化？

Question

我有一个全局变量，它的类型是String：

window.my_global_var = 'string';

它可能会被某些外部加载的 JavaScript 文件或 AJAX 请求更改。所以我想观看它并在更新时调用回调。

我搜索了一段时间，但发现 Object.observe 已经被弃用。我找到了答案，但它更好地用于观察对象，而不是字符串 window.variable。

最糟糕的方法是使用 asetInterval来观看它，但我想这太愚蠢了。

有什么好的方法可以做到这一点吗？

Answer 1

您可以Object.defineProperties使用window：

\n

function onValueUpdate(my_global_var) {\n   // Some arbitrary logic you want to execute on callback\n   console.log(`my_global_var was updated: ${my_global_var}`);\n}\n\nObject.defineProperties(window, {\n    _my_global_var: {\n        value: \'string\',\n        writable: true\n    },\n    my_global_var: {\n        get: function() {\n            return this._my_global_var;\n        },\n        set: function(val) {\n            this._my_global_var = val;\n            onValueUpdate(this._my_global_var);\n        }\n    }\n});\n\nwindow.my_global_var = \'New string\';\n

\n

当您访问它时window.my_global_var，它的行为与类型属性完全相同String。但是当您设置它时，您可以调整它以使用任何其他逻辑。

\n

函数onValueUpdate需要是公共的（或者您可以使用公共方法代替）。

\n

在您发现的答案中存在针对此方法的警告：

\n

\n

我不会采用 getter/setter 解决方案 - 它很复杂，不可扩展且不可维护。

\n

\n

因此，如果您需要可扩展性，您可能应该寻找一些可以做到这一点的库。否则这应该也同样有效。

\n