在 setTimeout 中传递 this.method 不起作用？

Question

我看到传递对象方法作为参数setTimeout的问题。我知道在嵌套函数中，这个范围需要手动设置，但如果我直接传递函数对象，在我的情况下this.count。为什么需要将匿名函数声明为第一个参数呢?计数已经是一个函数了。

Mozilla也使用function(msg) {self.remind(msg);}代替这个。提醒内部setTimeout第一个参数。

function Timer(count,start){
    this.count = count;
    this.start = start;
}
//below code works
Timer.prototype.counting = function(){
    var self = this;
    setTimeout(function(){self.counting();},this.start);
    console.log(this.count);
    this.count++;
};
//below code doesn't work
/*
Timer.prototype.counting = function(){
    setTimeout(this.counting,this.start);
    console.log(this.count);
    this.count++;
};
*/
var t1 = new Timer(0,1000);
t1.counting();
var t2 = new Timer(100,1000);
t2.counting();

Answer 1

setTimeout的MDN文档有一个完整的章节，我建议阅读它。

---

在你传递给setTimeout的回调中，this将指向window，而不是指向你的类的实例。

如果函数被调用，this.count(它指向window.count)将是undefined，因为没有全局的count变量。后来它变成了NaN (undefined++是NaN)。对象的count属性根本不会改变。

通过显式调用函数作为对象(self.counting())的方法，您可以确保this正确地引用类的实例。

您可以通过使用.bind ^[MDN]来实现相同的功能，而不是使用另一个函数:

setTimeout(this.counting.bind(this), this.start);

阅读这篇MDN文章，了解更多关于this的信息。