ES6块级作用域

为什么需要块级作用域?

ES6新增了一个作用域
块级作用域可以简单理解为包在{}里的内容，可以自成一个作用域，但ES5中也有{}可ES5没有块级作用域，这时候就要用到let 和const。因此可以将块级作用域理解为：使用let和const生命的变量只在当前{}内生效。由此构建出块级作用域。

这里{} 包括

if(){}
switch(){}
for(){}
while(){}
try()catch(err){}
{}

ES5 只有全局作用域和函数作用域，没有块级作用域，这导致很多场景不合理。

1、内层变量可能会覆盖外层变量。

var d = new Date()
function fn() {
  console.log(tmp)
  if (false) {
    var d =  'hello everybody'
  }
}
fn() 

f 代码块的外部使用外层的d变量，内部使用内层的 d 变量。但是，函数 fn 执行后，输出结果为 undefined ，原因在于变量提升导致内层的 d变量覆盖了外层的 d 变量。

2、用来计数的循环变量泄露为全局变量。

var s =  'hello everybody'
for (var i = O; i < s.length; i++) {
  console.log(s[i])
}
console.log(i) // 15

变量 i 只用来控制循环，但是循环结束后，它并没有消失，而是泄露成了全局变量。

let 实际上为 JavaScript 新增了块级作用域。

function fl() {
  let b = 5
  if (true) {
    let b = 10
  }
  console.log(b) // 5
}

上面的函数有两个代码块，都声明了变量 b，运行后输出 5 。这表示外层代码块不受内层代码块的影响。如果使用 var 定义变量 ，最后输出的值就是 10

块级作用域有什么用呢,看代码

//以前
for(var i=0 ;i<5;i++){
	setTimeout(()=>{
		console.log(i) // 5 5 5 5 5 
	},1000)
}
//想在let 后
for(let i=0;i<5;i++){
	setTimeout(()=>{
		console.log(i) // 0 1 2 3 4
	},1000)
}

ES5如何实现块级作用域

//利用闭包
for(var i=0;i<5;i++){
	(function(index){
		setTimeout(()=>{
			console.log(i) //0 1 2 3 4
		},1000)
	})()
}