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

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]（）；}

最简单的解决方案是，

而不是使用：

var funcs = [];
for(var i =0; i<3; i++){
    funcs[i] = function(){
        alert(i);
    }
}

for(var j =0; j<3; j++){
    funcs[j]();
}

警报“2”3次。这是因为在for循环中创建的匿名函数共享相同的闭包，并且在该闭包中，i的值是相同的。使用此选项可防止共享关闭：

var funcs = [];
for(var new_i =0; new_i<3; new_i++){
    (function(i){
        funcs[i] = function(){
            alert(i);
        }
    })(new_i);
}

for(var j =0; j<3; j++){
    funcs[j]();
}

这背后的想法是，用IIFE（立即调用函数表达式）封装for循环的整个主体，并将new_i作为参数传递，并将其捕获为i。由于匿名函数是立即执行的，因此匿名函数内部定义的每个函数的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</按钮>

在阅读了各种解决方案之后，我想补充一点，这些解决方案之所以有效，是因为依赖于范围链的概念。这是JavaScript在执行期间解析变量的方式。

每个函数定义形成一个范围，该范围由所有本地var声明的变量及其参数。如果我们在另一个（外部）函数中定义了内部函数形成一条链，并将在执行过程中使用当函数被执行时，运行时通过搜索作用域链来评估变量。如果在链的某个点上可以找到一个变量，它将停止搜索并使用它，否则将继续搜索，直到到达属于window的全局范围。

在初始代码中：

funcs = {};
for (var i = 0; i < 3; i++) {         
  funcs[i] = function inner() {        // function inner's scope contains nothing
    console.log("My value: " + i);    
  };
}
console.log(window.i)                  // test value 'i', print 3

当执行funcs时，作用域链将是函数inner->global。由于在函数内部找不到变量i（既没有使用var声明，也没有作为参数传递），因此它继续搜索，直到最终在全局范围（即window.i）中找到i的值。

通过将其包装在外部函数中，要么像harto那样显式定义助手函数，要么像Bjorn那样使用匿名函数：

funcs = {};
function outer(i) {              // function outer's scope contains 'i'
  return function inner() {      // function inner, closure created
   console.log("My value: " + i);
  };
}
for (var i = 0; i < 3; i++) {
  funcs[i] = outer(i);
}
console.log(window.i)          // print 3 still

当执行funcs时，现在作用域链将是函数inner->函数outer。这一次，可以在for循环中执行3次的外部函数的作用域中找到i，每次都有正确绑定的值i。当内部执行时，它不会使用window.i的值。

更多详情请点击此处它包括在循环中创建闭包的常见错误，以及我们需要闭包的原因和性能考虑。

您需要了解的是javascript中变量的范围是基于函数的。这与c#有一个重要的区别，因为c#有块作用域，只需将变量复制到for中的一个即可。

将其包装在一个函数中，该函数会像apphacker的答案那样计算返回函数的值，这会起到作用，因为变量现在具有函数作用域。

还有一个let关键字而不是var，这将允许使用块范围规则。在这种情况下，在for中定义一个变量就可以了。也就是说，由于兼容性，let关键字不是一个实用的解决方案。

var funcs=｛｝；对于（变量i=0；i<3；i++）{设索引=i//添加此funcs[i]=函数（）{console.log（“我的值：”+索引）//更改副本};}对于（变量j=0；j<3；j++）{函数[j]（）；}

这描述了在JavaScript中使用闭包的常见错误。

函数定义新环境

考虑：

function makeCounter()
{
  var obj = {counter: 0};
  return {
    inc: function(){obj.counter ++;},
    get: function(){return obj.counter;}
  };
}

counter1 = makeCounter();
counter2 = makeCounter();

counter1.inc();

alert(counter1.get()); // returns 1
alert(counter2.get()); // returns 0

每次调用makeCounter时，｛counter:0｝都会创建一个新对象。另外，obj的新副本也被创建以引用新对象。因此，计数器1和计数器2彼此独立。

回路中的闭合

在循环中使用闭包很棘手。

考虑：

var counters = [];

function makeCounters(num)
{
  for (var i = 0; i < num; i++)
  {
    var obj = {counter: 0};
    counters[i] = {
      inc: function(){obj.counter++;},
      get: function(){return obj.counter;}
    }; 
  }
}

makeCounters(2);

counters[0].inc();

alert(counters[0].get()); // returns 1
alert(counters[1].get()); // returns 1

请注意，计数器[0]和计数器[1]不是独立的。事实上，它们对同一个对象进行操作！

这是因为在循环的所有迭代中只有一个obj副本共享，可能是出于性能原因。即使｛counter:0｝在每次迭代中都创建了一个新对象，obj的同一副本也只会用对最新对象的引用。

解决方案是使用另一个助手函数：

function makeHelper(obj)
{
  return {
    inc: function(){obj.counter++;},
    get: function(){return obj.counter;}
  }; 
}

function makeCounters(num)
{
  for (var i = 0; i < num; i++)
  {
    var obj = {counter: 0};
    counters[i] = makeHelper(obj);
  }
}

这是因为直接分配了函数范围中的局部变量以及函数参数变量新副本。