如何檢測對象的change事件的屬性值？

我有這樣的對象：如何檢測對象的change事件的屬性值？

var Settings = { 
    color: localStorage.color, 
    size : localStorage.size 
};

我想自動保存到localStorage的新值一旦被改變了，這意味着我想要做這樣的事情：

Settings.onchange = function(p){ 
    localStorage[p] = this[p]; 
};

可能嗎？

PS：只需要Chrome支持。

來源

2012-02-24 wong2

你還好嗎寫一個屬性爲每一個？ – Ryan 2012-02-24 03:29:13

這是不可能的（你可以使用ES5 getters和setters我想）。我建議合併數據封裝並使用一種方法來設置屬性，例如'set（key，value）'並處理該函數內部的同步。 – 2012-02-24 03:30:08

Javascript [setters and getters]（http://robertnyman.com/2009/05/28/getters-and-setters-with-javascript-code-samples-and-demos/）是您的答案（但僅適用於瀏覽器支持他們）。 – RobG 2012-02-24 03:30:37

根據@RobG的評論，我寫了這個函數，它的工作原理！

function onPropertyChange(o, callback){ 
    for(var p in o){ 
     if(o.hasOwnProperty(p)){ 
      var originalVal = o[p]; 
      Object.defineProperty(o, p, { 
       get: function(){ 
        return originalVal; 
       }, 
       set: function(val){ 
        callback.call(o, p, val); 
        return originalVal = val; 
       } 
      }); 
     } 
    } 
} 

// example: 

var Settings = { 
    color: localStorage.color || "red", 
    size : localStorage.size || "12px" 
}; 

onPropertyChange(Settings, function(p, val){ 
    localStorage[p] = val; 
});

要點在這裏：https://gist.github.com/1897209

來源

2012-02-24 03:49:12 wong2

這可以監視已經設置的屬性，當一個新的屬性被添加到'Settings'時有什麼回調？ – 2017-03-26 16:40:19

如何檢測對象的change事件的屬性值？

回答

相關問題