javascript - 如何观察JS变量的值变化

Question

我想知道是否有人可以帮助我做一些我认为相当简单的事情:

本质上我想扩展所有数据类型(包括内部类型)的原型(prototype)，以允许某种自定义函数，考虑:

var x = "some string";
var y = 101;

x = "some other value";
y++;

x.onChange();
y.onChange();

这是我追求的基本想法，但我真正想要的是让 onChange(在本例中)有所不同，以便为实际变量(而不是标准原型(prototype)扩展)创建一个新函数，即:

x.onChange = function() {
    alert("x.onChange");
}

y.onChange = function() {
    alert("y.onChange");
}

这似乎不起作用，但我一定是遗漏了一些非常简单的东西，不是吗？我的意思是我当然可以扩展所有对象和类型并添加新功能...不是吗？

如有任何帮助，我们将不胜感激!

Answer 1

我可能不想通过尝试向现有类型添加方法来解决这个问题，而是创建一个可以包装原始类型的对象。我将此称为“观察”一个值，并且可能会像这样实现它:

function observable(v){
    this.value = v;

    this.valueChangedCallback = null;

    this.setValue = function(v){
        if(this.value != v){
            this.value = v;
            this.raiseChangedEvent(v);
        }
    };

    this.getValue = function(){
        return this.value;
    };

    this.onChange = function(callback){
        this.valueChangedCallback = callback;
    };

    this.raiseChangedEvent = function(v){
        if(this.valueChangedCallback){
             this.valueChangedCallback(v);
        }   
    };
}

然后这可以用于观察任何值的变化(只要该值随后仅通过可观察类上的方法更改 - IMO 的一个小减损)。

类似这样的东西可以用于上面的代码:

var obs = new observable(123);
obs.onChange(function(v){
         alert("value changed to: " + v);
     });

// the onChange callback would be called after something like obs.setValue(456);

这里是实例 --> http://jsfiddle.net/MeAhz/