ES6中阮一峰大神的解释
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 10
上面代码中，变量i是var命令声明的，在全局范围内都有效，所以全局只有一个变量i。每一次循环，变量i的值都会发生改变，而循环内被赋给数组a的函数内部的console.log(i)，里面的i指向的就是全局的i。也就是说，所有数组a的成员里面的i，指向的都是同一个i，导致运行时输出的是最后一轮的i的值，也就是 10。
如果使用let，声明的变量仅在块级作用域内有效，最后输出的是 6。
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
上面代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。你可能会问，如果每一轮循环的变量i都是重新声明的，那它怎么知道上一轮循环的值，从而计算出本轮循环的值？这是因为 JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算。
以上都为复制粘贴，想必大部分人都已经看过了，能理解的人一下就理解了，惭愧在行业内混了挺久，我一时间居然没理解上来。于是开始自行理解二者的区别。以下皆为我自己的理解过程，可以给新手们借鉴一下
新手教程
要读懂上面代码的步骤首先需要知道for循环的解析方式（以一个循环体为例）：
let i=0;
if(i<10){
a[i]=function(){
console.log(i)
}
};
i++;
最重要的是要理解最后a[i]函数执行在哪一个作用域内，其实是每一个循环外都需要包一个大括号，而a[i]的运行在最外层
{
let i=0;
if(i<10){
a[i]=function(){
console.log(i)
}
};
i++;
};
{
let i=2;
if(i<10){
a[i]=function(){
console.log(i)
}
};
i++;
}
.....
{
let i=10;
if(i<10){
a[i]=function(){
console.log(i)
}
};
i++;
}
a[6]()//console.log(i)；此时的i在自己的作用域内被赋值为6
//替换所有的let为var；i被最后的var赋值为10
let在for循环运行时互不影响，且读取自己作用域内的i的值；再将所有的let换成var,var在每次运行后都会改变i的值，而最后一次var将i赋值为10，所以任意的a[i]读到的i都是10。
最后
其实最终的误导区在于每个循环最外层的大括号，如果没有意识到每个循环最外层都有大括号，就会陷入误区，钻入无法理解的死循环中。 最后贴一段我在console中让我最终钻出误区的代码：
{var i=1;
function a(){console.log(i)}
};
{var i=2;
function b(){console.log(i)}
};
{var i=3;
function c(){console.log(i)}
};
a()
{let i=1;
function a(){console.log(i)}
};
{let i=2;
function b(){console.log(i)}
};
{let i=3;
function c(){console.log(i)}
};
a()
