如何有效偵測JavaScript中的變數變化？

偵測JavaScript 中變數變化的有效方法

在使用JavaScript 時，您可能會遇到這樣的場景：當特定變數的值發生變化。雖然過去並未原生支援此功能，但現在有幾種有效的技術可用。

使用代理對象（ES6）：

截至 2018 年，JavaScript 引入Proxy 對象，專門用於監控對象變化。透過為目標物件定義代理，您可以攔截並記錄任何屬性變更。

let targetObj = {};
let targetProxy = new Proxy(targetObj, {
  set: (target, key, value) => {
    console.log(`${key} set to ${value}`);
    return Reflect.set(target, key, value);
  }
});

targetProxy.hello_world = "test"; // Logs 'hello_world set to test'

對嵌套對象使用 Observable Slim：

處理嵌套時對象，使用代理對象可能具有挑戰性。在這種情況下，請考慮利用 Observable Slim 等函式庫，它專門觀察嵌套資料結構中的變化。

let test = { testing: {} };
let p = ObservableSlim.create(test, true, (changes) => {
  console.log(JSON.stringify(changes));
});

p.testing.blah = 42; // Logs a JSON string detailing the 'add' change

已棄用的方法：

值得注意的是，一些以前可用的方法（例如Object.watch 和Object.defineProperty）要么已棄用，要嘛需要臃腫的函式庫。因此，建議使用上述技術。

以上是如何有效偵測JavaScript中的變數變化？的詳細內容。更多資訊請關注PHP中文網其他相關文章！