javascript - setTimeout 的执行上下文(JavaScript)

Question

1) 谁能说明 setTimeout 在执行线程方面的工作原理。

考虑:

function foo() { alert('foo'); }
function bar() { alert('bar'); }  
setTimeout(foo,1000);
bar();

或

function foo() { alert('foo'); setTimeout(foo,1000); }
function bar() { alert('bar'); }  
setTimeout(foo,1000);
bar();

或

function foo() { alert('foo'); setTimeout(foo,1000); }
function bar() { /* an execution that runs with unknown time */ }  
setTimeout(foo,1000);
bar();

或

function foo() { alert('foo'); setTimeout(foo,1000); }
function bar() { /* some ajax call that reply with unknown time */ }  
setTimeout(foo,1000);
bar();

或

function foo() { alert('foo'); setTimeout(foo,1000); }
function bar() { alert('foo'); setTimeout(bar,1000); }  
setTimeout(foo,1000);
setTimeout(bar,1000);

2) 谁能解释为什么“这个”对象在 setTimeout 中不起作用，以及我们可以做些什么来解决这个问题？

Answer 1

一定要阅读@DaveAnderson 建议的文章。

至于其他的东西，setTimeout/setInterval有两种形式:

setTimeout(arg, timeout)

如果 arg 是一个字符串，那么它被视为要执行的源代码。这和 eval() 一样糟糕。避免它。

如果 arg 是一个函数，那么它会在全局上下文中执行:

var Test = function () {
    this.x = 1;
    setTimeout(function () {
        console.log('x: ' + this.x);
    }, 10);
};

var t = new Test();

打印 x: undefined.

所以你想做的是:

function foo() { alert('foo'); }
setTimeout('foo()', 1000);

或更好:

setTimeout(foo, 1000);

要固定函数的上下文，请使用绑定(bind)方法:

var Test = function () {
    this.x = 1;
    var f = function () {
        console.log('x: ' + this.x);
    };
    setTimeout(f.bind(this), 10);         // use this as the context
};

var t = new Test();

或手动执行:

var Test = function () {
    this.x = 1;
    var that = this;
    setTimeout(function () {
        console.log('x: ' + that.x);     // closure: closing over that
    }, 10);
};

var t = new Test();