当变量的值发生变化时如何调用Javascript函数？答案

【问题标题】：How to call a Javascript function when value of a variable changes?当变量的值发生变化时如何调用Javascript函数？
【发布时间】：2012-11-17 06:17:42
【问题描述】：

通常我们在点击按钮时调用 Javascript 函数。

<button onclick=function1();>Post message</button>

或者有时，我们可能会在特定时间调用 Javascript 函数。

window.onload = myFunction();
          function myFunction()
           {
                 setInterval(function1,t);  
           }

function1() 是任何 Javascript 函数。仅当脚本中变量的值发生更改时，我才想调用此函数。

例如：假设我有一个变量 abc。现在，当我使用下面的函数在页面上选择某些内容时，该变量的值会发生变化。

var abc = function getSelectionHTML() {
      var userSelection;
      if (window.getSelection) {
        // W3C Ranges
        userSelection = window.getSelection ();
        // Get the range:
        if (userSelection.getRangeAt) {
          if (userSelection.rangeCount > 0)
        var range = userSelection.getRangeAt(0);
          else
        return '';
        } else {
          var range = document.createRange ();
          range.setStart (userSelection.anchorNode, userSelection.anchorOffset);
          range.setEnd (userSelection.focusNode, userSelection.focusOffset);
        }
        // And the HTML:
        var clonedSelection = range.cloneContents ();
        var div = document.createElement ('div');

        div.appendChild (clonedSelection);
        return div.innerHTML;
      } else if (document.selection) {
        // Explorer selection, return the HTML
        try {
          userSelection = document.selection.createRange ();
          return userSelection.htmlText;
        } catch (err) {
          return '';
        }
      } else {
        return '';
      }
    }

如何alert(abc)只有当变量的值发生变化？请帮忙！

【问题讨论】：

标签： javascript function variables dom-events

【解决方案1】：

如果您的目标是“现代”浏览器，您可以使用 Object.defineProperty 定义一个 setter 函数，即每次设置相应字段的值时都会调用的函数。

由于 JS 中的“全局”变量只是窗口对象的成员，所以你应该能够做类似的事情

Object.defineProperty(window, "abc", { set: function(v) { 
  /* this is run every time abc is assigned a value: 
     the value being assigned can be found in v */
} } );

【讨论】：

【解决方案2】：

首先，你需要用Custom Setters and Getters定义你的变量abc：

var value_of_abc;
 Object.defineProperty(window, 'abc', {
    get: function() {
      console.log('get!');
      return value_of_abc;
    },
    set: function(value) {
      console.log('set!');
      value_of_abc = value;
    }
  });

那么每当你调用或改变变量abc，下面的事情就会发生。

window.abc //get!
window.abc = 1 //set!

【讨论】：