你的代码不起作用，因为它的作用是：

Create variable `funcs` and assign it an empty array;  
Loop from 0 up until it is less than 3 and assign it to variable `i`;
    Push to variable `funcs` next function:  
        // Only push (save), but don't execute
        **Write to console current value of variable `i`;**

// First loop has ended, i = 3;

Loop from 0 up until it is less than 3 and assign it to variable `j`;
    Call `j`-th function from variable `funcs`:  
        **Write to console current value of variable `i`;**  
        // Ask yourself NOW! What is the value of i?

现在问题是，调用函数时变量i的值是多少？因为第一个循环是在i<3的条件下创建的，所以当条件为false时，它会立即停止，所以它是i=3。

您需要理解，当您的函数被创建时，它们的代码都不会被执行，只会被保存以备以后使用。因此，当稍后调用它们时，解释器会执行它们并问：“i的当前值是多少？”

因此，您的目标是首先将i的值保存到函数，然后才将函数保存到funcs。例如，可以这样做：

var funcs = [];
for (var i = 0; i < 3; i++) {          // let's create 3 functions
    funcs[i] = function(x) {            // and store them in funcs
        console.log("My value: " + x); // each should log its value.
    }.bind(null, i);
}
for (var j = 0; j < 3; j++) {
    funcs[j]();                        // and now let's run each one to see
}

这样，每个函数都有自己的变量x，我们在每次迭代中将这个x设置为i的值。

这只是解决这个问题的多种方法之一。

计数器是基元

让我们如下定义回调函数：

// ****************************
// COUNTER BEING A PRIMITIVE
// ****************************
function test1() {
    for (var i=0; i<2; i++) {
        setTimeout(function() {
            console.log(i);
        });
    }
}
test1();
// 2
// 2

超时完成后，它将为两个打印2。这是因为回调函数访问基于词法范围的值，该范围是函数定义的地方。

为了在定义回调时传递和保留值，我们可以创建一个闭包，在调用回调之前保留值。这可以通过以下方式完成：

function test2() {
    function sendRequest(i) {
        setTimeout(function() {
            console.log(i);
        });
    }

    for (var i = 0; i < 2; i++) {
        sendRequest(i);
    }
}
test2();
// 1
// 2

现在，这一点的特殊之处在于“基元是按值传递并复制的。因此，当定义闭包时，它们会保留上一个循环的值。”

计数器是一个对象

由于闭包可以通过引用访问父函数变量，因此这种方法与原语不同。

// ****************************
// COUNTER BEING AN OBJECT
// ****************************
function test3() {
    var index = { i: 0 };
    for (index.i=0; index.i<2; index.i++) {
        setTimeout(function() {
            console.log('test3: ' + index.i);
        });
    }
}
test3();
// 2
// 2

因此，即使为作为对象传递的变量创建了闭包，也不会保留循环索引的值。这是为了表明对象的值不是复制的，而是通过引用访问的。

function test4() {
    var index = { i: 0 };
    function sendRequest(index, i) {
        setTimeout(function() {
            console.log('index: ' + index);
            console.log('i: ' + i);
            console.log(index[i]);
        });
    }

    for (index.i=0; index.i<2; index.i++) {
        sendRequest(index, index.i);
    }
}
test4();
// index: { i: 2}
// 0
// undefined

// index: { i: 2}
// 1
// undefined

最初的示例不起作用的原因是，您在循环中创建的所有闭包都引用了同一帧。实际上，一个对象上有3个方法，只有一个i变量。他们都打印出相同的值。

问题是，每个匿名函数中的变量i都绑定到函数外部的同一变量。

ES6解决方案：让

ECMAScript 6（ES6）引入了新的let和const关键字，它们的作用域不同于基于var的变量。例如，在具有基于let的索引的循环中，循环中的每个迭代都将有一个具有循环范围的新变量i，因此您的代码将按预期工作。有很多资源，但我推荐2ality的块范围帖子作为一个很好的信息来源。

for (let i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value: " + i);
  };
}

不过，请注意，IE9-IE11和Edge 14之前的Edge支持以上错误（它们不会每次都创建一个新的i，所以上面的所有函数都会记录3，就像我们使用var时一样）。边缘14最终得到了正确的结果。

ES5.1解决方案：针对每个

随着Array.prototype.forEach函数的广泛使用（2015年），值得注意的是，在那些主要涉及对值数组进行迭代的情况下，.forEach（）提供了一种干净、自然的方式，可以为每次迭代获得一个独特的闭包。也就是说，假设您有某种包含值（DOM引用、对象等）的数组，并且设置特定于每个元素的回调时会出现问题，您可以这样做：

var someArray = [ /* whatever */ ];
// ...
someArray.forEach(function(arrayElement) {
  // ... code code code for this one element
  someAsynchronousFunction(arrayElement, function() {
    arrayElement.doSomething();
  });
});

其思想是，与.forEach循环一起使用的回调函数的每次调用都将是其自己的闭包。传递给该处理程序的参数是特定于迭代的特定步骤的数组元素。如果在异步回调中使用它，它不会与在迭代的其他步骤中建立的任何其他回调冲突。

如果您恰好在jQuery中工作，$.each（）函数将为您提供类似的功能。

经典解决方案：封口

您要做的是将每个函数内的变量绑定到函数外的一个单独的不变值：

var函数=[]；函数createfunc（i）{返回函数（）{console.log（“我的值：”+i）；};}对于（变量i=0；i<3；i++）{funcs[i]=创建函数（i）；}对于（变量j=0；j<3；j++）{//现在让我们逐一查看函数[j]（）；}

由于JavaScript中没有块作用域-只有函数作用域-通过将函数创建包装在一个新函数中，可以确保“i”的值保持如预期的那样。

这个问题确实展示了JavaScript的历史！现在，我们可以避免使用箭头函数的块作用域，并使用Object方法直接处理来自DOM节点的循环。

常量函数=[1，2，3].map（i=>（）=>console.log（i））；函数映射（fn=>fn（））

const buttons=document.getElementsByTagName（“button”）；对象按键（按钮）.map（i=>按钮[i].addEventListener（'click'，（）=>console.log（i）））；<button>0</button><br><button>1</button><br><按钮>2</按钮>

首先，了解此代码的错误：

var funcs = [];
for (var i = 0; i < 3; i++) {          // let's create 3 functions
    funcs[i] = function() {            // and store them in funcs
        console.log("My value: " + i); // each should log its value.
    };
}
for (var j = 0; j < 3; j++) {
    funcs[j]();                        // and now let's run each one to see
}

这里，当funcs[]数组初始化时，i递增，funcs数组初始化，func数组的大小变为3，因此i=3，。现在，当调用funcs[j]（）时，它再次使用变量i，变量i已经增加到3。

现在要解决这个问题，我们有很多选择。以下是其中两个：

我们可以用let初始化i，或者用let初始化一个新的变量索引，并使其等于i。因此，当进行调用时，将使用索引，其范围将在初始化后结束。对于调用，索引将再次初始化：var函数=[]；对于（var i=0；i<3；i++）{设索引=i；funcs[i]=函数（）｛console.log（“我的值：”+索引）；};}对于（变量j=0；j<3；j++）{函数[j]（）；}其他选项可以是引入一个返回实际函数的tempFunc：var函数=[]；函数tempFunc（i）{返回函数（）{console.log（“我的值：”+i）；};}对于（var i=0；i<3；i++）{funcs[i]=tempFunc（i）；}对于（变量j=0；j<3；j++）{函数[j]（）；}