Javascript 属性为 NaN

Question

我有以下 javascript 代码:

var Environment = function() {
    this.road_frame_id = 1;   
}

Environment.prototype.nextRoadFrame = function() {
    if((this.road_frame_id -= 1) < 1) { 
        this.road_frame_id = 3;
    }
    document.getElementById("road").setAttribute("src", "images/road_background_" + this.road_frame_id + ".png");
}

var environment = new Environment();
setInterval(environment.nextRoadFrame, 150);

但似乎在函数 nextRoadFrame 中，属性 this.road_frame_id 的值为 NaN，而它应该是 3。为什么会这样？

谢谢

Answer 1

您正在传递存储在 environment.nextRoadFrame 中的函数，但没有任何上下文，因此 this 的值将是 window打电话。

创建一个使用正确上下文调用您的函数的新函数，并将其传递给 setInterval。

setInterval(environment.nextRoadFrame.bind(environment), 150);

参见 documentation for bind兼容性和替代品。