无法使用“this”调用方法[重复]答案

【问题标题】：Can't call a method by using 'this' [duplicate]无法使用“this”调用方法[重复]
【发布时间】：2014-09-02 22:02:12
【问题描述】：

我正在尝试调用我的方法 Move();在对象 MySnake 中使用 setInterval：

function Snake()
{
    this.Start = function(Speed)
    {
        this.Movement = setInterval(function(){
            this.Move();
        },Speed);
    }
}
var MySnake = new Snake();
MySnake.Start(400); //Doesn't work

这不起作用。但是当我通过实例“MySnake”调用该方法时：

function Snake() 
{
    MySnake.Start = function(Speed)
    {
        this.Movement = setInterval(function(){
            MySnake.Move();
        },Speed);
    }
}
var MySnake = new Snake();
MySnake.Start(400); //Works

我不希望使用“this”关键字来工作

【问题讨论】：

请注意，在区间回调中，this 很可能是窗口，因此您尝试调用window.Move()，否则它似乎可以工作？
jsfiddle.net/adeneo/TLaR6
这很有用！谢谢！

标签： javascript methods this

【解决方案1】：

当你这样做时.move(); “this”在传递给 setInterval 方法的匿名函数内，因此您会收到错误消息。

function Snake()
{

    this.Start = function(Speed)
    {
        var _this = this;
        this.Movement = setInterval(function(){
            _this.Move();
        },Speed);
    }
}

var MySnake = new Snake();

MySnake.Start(400)

这将起作用，因为对对象的引用是由 setInterval 的回调创建的闭包捕获的。

【讨论】：

【解决方案2】：

这是因为 this 是由 JavaScript 中的调用者定义的。最简单的解决方案是将其存储在另一个变量中：

function Snake()
{

    this.Start = function(Speed)
    {
        var that = this;
        this.Movement = setInterval(function(){
            that.Move();
        },Speed);
    }
}
var MySnake = new Snake();
MySnake.Start(400); //Work

这是一个有效的jsfiddle。在您的示例中，内部 this 是全局 window。

另一种解决方案是将函数中的this绑定到本地this，如second jsfiddle所示：

function Snake()
{
    this.Move = function() { document.body.innerHTML += '.'; };

    this.Start = function(Speed)
    {
        this.Movement = setInterval((function(){
            this.Move();
        }).bind(this),Speed);
    }
}
var MySnake = new Snake();
MySnake.Start(400); //Work

但是这个比较难读。

【讨论】：