试试这个短一点的

无阵列没有额外的for循环

for (var i = 0; i < 3; i++) {
    createfunc(i)();
}

function createfunc(i) {
    return function(){console.log("My value: " + i);};
}

http://jsfiddle.net/7P6EN/

我们将检查，当您声明var并让逐一地。

案例1：使用var

<script>
   var funcs = [];
   for (var i = 0; i < 3; i++) {
     funcs[i] = function () {
        debugger;
        console.log("My value: " + i);
     };
   }
   console.log(funcs);
</script>

现在，按F12打开铬控制台窗口并刷新页面。在数组中每3个函数展开一次。您将看到一个名为[[Scopes]]的属性。展开该属性。你会看到一个名为“Global”的数组对象，展开该对象。您将发现对象中声明的属性“i”具有值3。

结论：

当您在函数外部使用“var”声明变量时，它将变为全局变量（您可以通过键入i或window.i。它将返回3）。除非调用功能。调用函数时，console.log（“My value:”+i）从其Global对象中获取值，并显示后果

CASE2：使用let

现在将“var”替换为“let”

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

做同样的事情，去观察镜。现在您将看到两个对象“块”和“全局”。现在展开Block对象将看到这里定义了“i”，奇怪的是，对于每个函数，如果i不同（0，1，2），则其值是不同的。

结论：

当您在函数外部但在循环内部使用“let”声明变量时，此变量将不是全局变量变量，它将成为块级变量，仅可用于同一函数。这就是为什么，我们调用函数时，每个函数的i值都不同。

有关更紧密的工作原理的更多信息，请浏览精彩的视频教程https://youtu.be/71AtaJpJHw0

直到ES5，这个问题只能用闭包来解决。

但现在在ES6中，我们有块级范围变量。将var更改为let in first for循环将解决问题。

var函数=[]；for（假设i=0；i<3；i++）{//让我们创建3个函数funcs[i]=function（）｛//并将它们存储在funcs中console.log（“我的值：”+i）；//每个都应该记录其值。};}对于（变量j=0；j<3；j++）{函数[j]（）；//现在让我们逐一查看}

我很惊讶还没有人建议使用forEach函数来更好地避免（重新）使用局部变量。事实上，出于这个原因，我不再使用for（var I…）。

[0,2,3].forEach(function(i){ console.log('My value:', i); });
// My value: 0
// My value: 2
// My value: 3

//编辑为使用forEach而不是map。

我更喜欢使用forEach函数，它有自己的闭包，可以创建伪范围：

var funcs = [];

new Array(3).fill(0).forEach(function (_, i) { // creating a range
    funcs[i] = function() {            
        // now i is safely incapsulated 
        console.log("My value: " + i);
    };
});

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

这看起来比其他语言的范围更丑陋，但IMHO比其他解决方案更不可怕。

聚会的时间有点晚了，但我今天正在探讨这个问题，并注意到许多答案并没有完全解决Javascript如何处理作用域的问题，这本质上就是问题的根源。

所以正如许多其他人提到的，问题是内部函数引用的是同一个i变量。那么为什么我们不在每次迭代时都创建一个新的局部变量，并让内部函数引用它呢？

//覆盖console.log（），以便可以看到控制台输出console.log=函数（消息）｛document.body.innerHTML+='<p>'+msg+'</p>'；｝；var funcs=｛｝；对于（变量i=0；i<3；i++）{var ilocal=i//创建新的局部变量funcs[i]=函数（）{console.log（“我的值：”+ilocal）//每个都应该引用自己的局部变量};}对于（变量j=0；j<3；j++）{函数[j]（）；}

就像之前一样，每个内部函数输出分配给i的最后一个值，现在每个内部函数只输出分配给ilocal的最后一值。但每个迭代不应该有自己的ilocal吗？

事实证明，这就是问题所在。每个迭代都共享相同的范围，因此第一次迭代之后的每个迭代都只是覆盖ilocal。来自MDN：

重要提示：JavaScript没有块范围。随块引入的变量的作用域是包含函数或脚本，设置这些变量的效果将持续到块本身之外。换句话说，块语句不引入范围。尽管“独立”块是有效的语法，但您不希望在JavaScript中使用独立块，因为如果您认为它们在C或Java中做类似的事情，它们不会做您认为它们做的事情。

再次强调：

JavaScript没有块范围。随块引入的变量的作用域是包含函数或脚本

通过在每次迭代中声明ilocal之前检查ilocal，我们可以看到这一点：

//覆盖console.log（），以便可以看到控制台输出console.log=函数（消息）｛document.body.innerHTML+='<p>'+msg+'</p>'；｝；var funcs=｛｝；对于（变量i=0；i<3；i++）{console.log（ilocal）；var ilocal=i；}

这正是这个bug如此棘手的原因。即使您正在重新定义变量，Javascript也不会抛出错误，JSLint甚至不会抛出警告。这也是为什么解决这一问题的最佳方法是利用闭包，这本质上就是在Javascript中，内部函数可以访问外部变量，因为内部作用域“包围”外部作用域。

这也意味着内部函数“抓住”外部变量并保持它们的活力，即使外部函数返回。为了利用这一点，我们创建并调用一个包装函数来创建一个新的作用域，在新作用域中声明ilocal，并返回一个使用ilocal的内部函数（下面有更多解释）：

//覆盖console.log（），以便可以看到控制台输出console.log=函数（消息）｛document.body.innerHTML+='<p>'+msg+'</p>'；｝；var funcs=｛｝；对于（变量i=0；i<3；i++）{funcs[i]=（function（）｛//使用包装函数创建新范围var ilocal=i//将i捕获到本地var中return function（）｛//返回内部函数console.log（“我的值：”+ilocal）；};})(); //记住运行包装器函数}对于（变量j=0；j<3；j++）{函数[j]（）；}

在包装器函数内创建内部函数为内部函数提供了一个只有它才能访问的私有环境，即“闭包”。因此，每次调用包装器函数时，我们都会创建一个新的内部函数，并使用它自己的独立环境，确保ilocal变量不会相互冲突和覆盖。一些小的优化给出了许多其他SO用户给出的最终答案：

//覆盖console.log（），以便可以看到控制台输出console.log=函数（消息）｛document.body.innerHTML+='<p>'+msg+'</p>'；｝；var funcs=｛｝；对于（变量i=0；i<3；i++）{funcs[i]=包装器（i）；}对于（变量j=0；j<3；j++）{函数[j]（）；}//为内部函数创建单独的环境函数包装器（ilocal）{return function（）｛//返回内部函数console.log（“我的值：”+ilocal）；};}

使现代化

随着ES6成为主流，我们现在可以使用新的let关键字来创建块范围的变量：

//覆盖console.log（），以便可以看到控制台输出console.log=函数（消息）｛document.body.innerHTML+='<p>'+msg+'</p>'；｝；var funcs=｛｝；for（设i=0；i<3；i++）{//使用“let”声明“i”funcs[i]=函数（）{console.log（“我的值：”+i）//每个都应该引用自己的局部变量};}对于（var j=0；j<3；j++）{//我们可以在这里使用“var”函数[j]（）；}

看看现在有多容易！有关更多信息，请参阅此答案，我的信息基于此。