setTimeout 中的 JavaScript 对象函数访问变量

Question

我是 JS 中 OOP 的新手。现在我正在尝试在实例中调用变量，但是如何在函数中调用它？

var foo = function() {

    this.a = 1;    // how can I call 'a' in the setTimeout() function

    this.start = function(i) {
        if (i<3){
            window.setTimeout(function() {

                console.log(a);    // this line shows undefined
                console.log(this.a);      // this line indicates 'this' is window

                i++;
                start(i);    // this one does not work as well

            }, 2000);
        }
    };
};

var bar = new foo(); 
bar.start(0);

Answer 1

只需将this 存储在函数之前的变量中即可：

var foo = function() {

    this.a = 1;    // how can I call 'a' in the setTimeout() function

    this.start = function(i) {
        var that = this;
        if (i<3){
            window.setTimeout(function() {

                console.log(that.a);      

                i++;
                that.start(i);    // this one does not work as well

            }, 2000);
        }
    };
};

var bar = new foo(); 
bar.start(0);

或者，您可以根据项目要求使用 ES6 的新 arrow functions：

window.setTimeout(() => {

    console.log(this.a);      

    i++;
    this.start(i);    // this one does not work as well
}, 2000);