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

时间:2013-05-16 07:47:17

标签: javascript object properties reference

我遇到了 - 似乎 - 有点奇怪的问题。假设我有一个像这样的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进行演示。单击“开始”以启动计时器并更新值。如您所见,使用parseInt也无济于事。

我在Firefox,Chrome和IE10中对此进行了测试。它们都表现出相同的行为。

为什么不能使用this从具有函数值的另一个属性中引用具有数值的属性?为什么它适用于非数字值?这是一个错误还是这个?

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

1 个答案:

答案 0 :(得分:2)

setTimeoutwindow上下文中运行该函数,因此this内的window引用bind。如果您this正确的interval = setInterval(Object.Update.bind(Object), 1000); -----^------ 上下文,那么它将正常工作:

bind

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

interval = setInterval(function(){ Object.Update(); }, 1000); 仅适用于现代浏览器,因此如果您需要支持旧版IE,请使用匿名函数:

this

请记住,在JavaScript中{{1}}取决于您调用函数的方式;它是可变的。