ES5只有全局作用域和函数作用域，没有块级作用域，这带来了一些不合理的场景。
场景一，内层变量可能会覆盖外层变量。
var tmp = new Date()
function f() {
console.log(tmp)
if (false) {
var tmp = 'hello world';
}
}
f() // undefined
场景二，用来计数的循环变量泄露为全局变量。
var s = 'hello';
for (var i = 0; i < s.length; i++) {
console.log(s[i])
}
console.log(i) // 5
为了解决以上问题，ES6提出了块级作用域。何为块级作用域呢，简单来说，就是一个{ }就是一个块级作用域。
让我们来看一个例子：
var list = []
for (var i = 0; i < 5; i++) {
list[i] = function() {
console.log(i)
}
}
list[2]() // 5
如果变量使用的是var声明，每一次打印出来的都会是5，而不是当前值，这是为什么呢？其实上面代码相当于下面这样：
var list = []
// for循环只是为数组添加了function元素，但是并没有为function里面的i绑定当前的循环值
var i = 0;
list[0] = function() {
console.log(i)
}
i++; // 1
list[1] = function() {
console.log(i)
}
i++; // 2
list[2] = function() {
console.log(i)
}
i++; // 3
list[3] = function() {
console.log(i)
}
i++; // 4
list[4] = function() {
console.log(i)
}
i++; // 5
// 注意这个时候i已经变成了5
list = [
function() { console.log(i) },
function() { console.log(i) },
function() { console.log(i) },
function() { console.log(i) },
function() { console.log(i) }
]
// 函数执行是没有传参的，调用的是全局的i
list[2]() // 5
以上可见，list数组里的每个函数调用的都是全局的i，而非当前循环的i，而又因为JS是从上到下执行的，所以最终打印的就是所有循环结束后的i。
那么应该如何来解决这个问题呢？其实很简单，回到我们的开头，ES5只有全局和函数2个作用域，而这种情况是因为函数读取了全局变量导致的，那我们在它读取全局变量之前覆盖它，或者给一个局部（函数）变量不就行？是的，核心思想就是这样，不过有几种不同的实现方式。
方法一，ES5的问题依然由ES5解决，这个时候就需要用到鼎鼎有名的闭包了。
var list = []
for (var i = 0; i < 5; i++) {
(function(temp) {
list[i] = function() {
console.log(temp)
}
})(i)
// }(i)) 也一样
}
list[2]() // 2
其实很简单，就是在list[i]被赋值之前，在它的外层包裹一个新的函数，这个函数是一个立即执行函数IIFE，它会创建一个局部（函数）变量temp，而list[i]这个时候改为调用temp，所以结果就可以跟当前的循环值对应起来。
方法二，使用ES6的新特性，let关键字创建一个块级作用域。
var list = []
for (let i = 0; i < 5; i++) {
list[i] = function() {
console.log(i)
}
}
list[2]() // 2
上面代码相当于下面这样：
var list = []
{
let i = 0;
list[i] = function() { console.log(i) }
}
{
let i = 1;
list[i] = function() { console.log(i) }
}
{
let i = 2;
list[i] = function() { console.log(i) }
}
{
let i = 3;
list[i] = function() { console.log(i) }
}
{
let i = 4;
list[i] = function() { console.log(i) }
}
list[2]() // 2
它就是每次循环都创建了一个新的变量，而这个变量处于块级作用域之内，所以不会跟其他的混乱。
