JavaScript setTime（）与回调VS. 具有匿名功能

Question

I found the following two examples of setTime function, although the code looks the same, the result is different in the two cases.

Example1: Result "Hello Stack Overflow"

var a = "world";  
setTimeout(function(){alert("Hello " + a)}, 2000);  
a = "Stack Overflow";    

Example2: Result "Hello world"

function callback(a){  
    return function(){  
        alert("Hello " + a);  
    }  
}  
var a = "world";    
setTimeout(callback(a), 2000);    
a = "Stack Overflow";    

Why in the first example the value of a changed, and in excample2 it didn't?

Answer 1

In the first example, the function reads the value of a directly. In the second example, the function reads the value of the parameter passed to it's factory function. Even though we reassign the value of the variable later, that doesn't affect the value of the parameter. It might be more clear if a different name is used for the parameter:

function callback(x){  
    return function(){  
        alert("Hello " + x);  
    }  
}  
var a = "world";    
setTimeout(callback(a), 2000);    
a = "Stack Overflow";

If you had used an object, you'd have a different story. Modifying your examples slightly, these both have the same result:

Example 1

var o = {};
o.a = "world";
setTimeout(function(){alert("Hello " + o.a)}, 2000);  
o.a = "Stack Overflow";

Example 2

function callback(obj){  
    return function(){  
        alert("Hello " + obj.a);  
    }  
} 
var o = {};
o.a = "world";
setTimeout(callback(o), 2000);    
o.a = "Stack Overflow";    

Answer 2

It doesn't change in the second example because you are actually creating a new local variable a as the argument to the callback function. So when you change the value of the global a it doesn't effect the value of the a inside that function.

• global var a points at the string "world"
• global var a gets passed to function
• local var a is created and set to the value of global var a
• global var a is set to a new value
• function later runs, and uses the value of local var a

So because function arguments have the semantics of local variables, you can't change it after the fact like this.

Answer 3

In your second example callback(a) creates a closure which maintains the current value of a so when it executes after the specified timeout you see the old value.

You should read this JavaScript Closure

Answer 4

通过调用callback函数， a的初始值被复制（通过值传递），返回的函数形成一个闭包，这就是它显示初始值而不是最新值的原因。

Answer 5

第二个没有按预期工作，因为你正在调用函数 ，这使它立即执行，而不是传递给setTimeout，它将在指定的时间后执行。