this.connection 的 JavaScript 作用域问题

Question

我有以下 JavaScript 代码。在函数更新中，this.connection 解析为未定义而不是数字。我做错了什么？

function Net()
{
    this.connection = -1;    
    this.counter = 1;
    this.timelastsend = -1;
    setInterval( this.update, 3000);
}

Net.prototype.update = function()
{          
    if (this.connection > 0 && this.timelastsend > 0)
    {
        var now = new Date().valueOf();        
        if (now - this.timelastsend > 1000 * 60)
        {

        }
    }
}

Answer 1

使用 this 的问题之一是 this 取决于您调用函数的方式。

setInterval 将调用您的 update 方法，就像它是一个独立函数一样，因此 this 将被设置为全局对象。

如果您确实需要使用 this 功能，请重写对 setInterval 的调用，如下所示:

function Net() {
    var self = this;
    this.connection = -1;    
    this.counter = 1;
    this.timelastsend = -1;
    setInterval( function () { self.update() }, 3000);
}

这样，您将创建一个 self 变量，该变量将继续引用您的对象(如果您是使用 new 创建的) > 运算符 — 避免 this 的另一个原因。

<小时/>

附录:如果您没有主动从 Net 伪类中继承大量对象，我将按如下方式重构该内容:

function createNet() {
    var connection = -1,
        counter = -1,
        timelastsent = -1,
        self,
        update;

    update = function () {
        var now;
        if (connection > 0 && timelastsent > 0) {
            now = new Date().valueOf();
            if (now - timelastsent > 1000 * 60) {

                // ... update code ...

                counter += 1;
                timelastsent = now;
            }
        }
    };

    setInterval(update, 3000);

    return {
        update: update,
        getTimeLastSent: function () { return timelastsent; },
        getCounter: function () { return counter; },
        getConnection: function () { return connection; }
    };
}

您会注意到任何地方都没有提及 this，这意味着没有歧义。我为连接、计数器和 timelastsent 属性添加了三个 getter，但如果您希望这些属性可从对象外部写入，您可以轻松地将它们添加到创建的对象中。