javascript - 闭包困惑

Question

我对这个 Closure 的事情有些困惑。我在下面有两个单独的代码，它们看起来相似但输出不同。

function setup(x) {
var array = [];
for(var i=0;i<arguments.length;i++){
    array[i]= arguments[i];
}
return array;
}
console.log(setup('a','b'));  // will output ["a","b"] 

--------------
function f() {
var i, array = [];
for(i = 0; i < 3; i++) {
    array[i] = function(){
        return i;
    }
}
return array;
}

var a = f();                 
console.log(a());       //output: [function(),function(),function()]
console.log(a[0]());    //output: 3 //same output in a[1]() and a[2]() calls as well

现在我的问题是，为什么输出不同？上面的两个代码都返回一个数组。在第一个代码中，它正确打印数组中的所有元素，而在第二个代码中，为什么不打印 [1,2,3]？？？

Answer 1

在您的第二个示例中，您正在创建 3循环中的函数，但所有函数都是在相同的变量范围内创建的，因此它们都引用并返回相同的值 i变量。

因此 i 的值从函数返回的值表示调用函数时的值。因为您在循环之后调用它们，所以 i 的值是3 ，所以这就是返回的值。

这就是闭包的意思。函数“关闭”存在于创建它们的变量范围内的变量。它们不会关闭变量的值，而是关闭变量本身，因此它们始终获取变量的当前状态。

为每个函数引用不同的值i , 每个函数都需要在一个单独的变量范围内创建，该范围有自己独特的 i .

因为在 JavaScript 中创建新变量作用域的唯一方法是调用函数，所以您需要在新函数调用中创建每个函数。

function makeFunction(j) {
    return function(){
        return j;
    };
}

function f() {
    var i, array = [];
    for(i = 0; i < 3; i++) {
        array[i] = makeFunction(i);
    }
    return array;
}

所以我在这里创建了一个名为 makeFunction 的新函数.它接收一个参数，并返回一个引用并返回该参数的新函数。

因为每次调用 makeFunction创建一个新的和唯一的变量范围，返回的每个函数将引用它自己的唯一 j变量，因此将返回 j 的值makeFunction时存在被调用(除非您的函数修改了 j ，如果您愿意，它可以这样做)。

请注意，我使用了变量名 j为清楚起见。你可以使用 i以及，或其他名称。