在JavaScript中引用具有数值的对象属性

Question

我遇到了一个看起来有点奇怪的问题。假设我有一个JavaScript对象，如下所示：

var Object = {
    Property1: 0,
    Property2: 1,
    TxtProperty: "Sample text",

    Update: function () {
        this.Property1++;                      // Doesn't work
        Object.Property2++;                    // Does work
        this.TxtProperty = "Hello world";      // Does work

        $('#prop-1').text(this.Property1);     // Prints NaN
        $('#prop-2').text(Object.Property2);   // Prints correct value
        $('#txt-prop').text(this.TxtProperty); // Prints correct value
    }
};

See this fiddle进行演示。单击“start”启动计时器并更新值。正如您所看到的，使用parseInt也没有什么帮助。

我已经在火狐、Chrome和IE10上测试过了。它们都表现出相同的行为。

为什么不能使用this从一个带有函数值的属性中引用一个带有数值的属性呢？为什么它可以处理非数字值？这是一个bug，还是有意为之？

这并不是一个真正的问题，因为我们可以简单地使用父对象的名称来更新数值，但我只是好奇为什么会这样。

Answer 1

setTimeout在window上下文中运行该函数，因此其中的this引用window。如果您bind正确的this上下文，那么它将工作得很好：

interval = setInterval(Object.Update.bind(Object), 1000);
                                     -----^------

演示：http://jsfiddle.net/wC2uM/2/

bind只能在现代浏览器中工作，所以如果您需要支持旧的IE，请使用匿名函数：

interval = setInterval(function(){ Object.Update(); }, 1000);

请记住，在JavaScript中，this取决于调用函数的方式；它是可变的。