深刻理解ES6之《块级做用域绑定》

众所周知，js中的var声明存在变量提高机制，所以ESMAScript 6引用了块级做用域来强化对变量生命周期的控制
let const 声明不会被提高，有几个须要注意的点
一、不能被重复声明

假设做用域中已经存在某个标识符（不管该标识符是经过var声明仍是let、const变量声明），此时再使用let或const关键定声明会抛错

var count=10
let count=20// 此处则会抛出错误，由于同一做用域内不能重复声明

若是当前做用域内嵌另外一个做用域，即可在内嵌的做用域中用let声明同名变量

var count=10
if(true){
    let count=20
}

二、const声明的常量必须进行初始化
像下面这样声明就会报错

const name;//语法错误，常量未初始化

三、不能够为const定义的常量再赋值，真正的本质是const声明不容许修改绑定，但容许修改值（也就是说const声明对象后，能够修改该对象的属性值）

const person={
  name:'angela'
}
//能够修改对象属性的值
person.name='yun'
// 修改绑定则会抛出语法错误
person={
  'name':'Shining'
}

四、临时性死区(Temporal Dead Zone)
JavaScript引擎在扫描代码发现变量声明时，要么将它们提高至做用域顶部（遇到var声明），要么将声明放到TDZ中（遇到let和const声明），访问TDZ中的变量会触发运行时错误，只有执行过变量声明语句后，变量才会从TDZ中移出，才能正常访问
以下代码就由于在if块级做用域内执行console.log时value已经在TDZ中了，之前typeof是一个相对不易出错的操做符，但其实也没法阻挡引擎抛出错误
在声明前访问块级绑定会致使错误，由于绑定在临时死区中

if (true) {
  console.log(typeof value)//引用错误
  let value = 'blue'
}

而在let声明的做用域外对该变量使用typeof则不会报错

console.log(typeof value)
if (true) {  
  let value = 'blue'
}

五、块级做用域绑定
以前在循环中建立函数都有些不可言状

var funcs = []
for (var i = 0; i < 10; i++) {
  funcs.push(function () {
    console.log(i)
  })
}
funcs.forEach(function (func) {
  func()
})

由于循环内部建立的函数所有都保留了对相同变量的引用，循环结束时变量i的值为10，因此结果会输出10次10
因而你们会在循环中使用当即调用函数表达式，以强制生成计数器变量的副本，以便输出一、二、3......

var funcs = []
for (var i = 0; i < 10; i++) {

  funcs.push((function (value) {
    return function () {
      console.log(value)
    }
  })(i))

}
funcs.forEach(function (func) {
  func()
})

有了let，当即调用函数表达式则能够简化，其实每次迭代循环都会建立一个新变量，并以以前迭代中同名变量的值将其初始化

var funcs = []
for (let i = 0; i < 10; i++) {
//实际上是每次循环的时候let声明都会建立一个新变量i并将其初始化为i的当前值，因此在循环内部建立的每一个函数都能获得属于它们本身的i的副本
  funcs.push(function () {
    console.log(i)
  })
}
funcs.forEach(function (func) {
  func()//这里输出是0 而后是一、2....9
})

这个特性一样适用于for in中，举例来讲

var funcs = [],
  obj = {
    a: true,
    b: true,
    c: true
  }
for (let key in obj) {
  funcs.push(function () {
    console.log(key)
  })
}
funcs.forEach(function (func) {
  func()//输出的是a  b  c
})

六、循环中的let声明特性一样适用于const声明，惟一的区别是const不能更改绑定
上面的例子中把let换成const一样输出a b c

var funcs = [],
  obj = {
    a: true,
    b: true,
    c: true
  }
//之因此能够运用for in 和for of循环中，是由于每次迭代不会修改已有绑定，而是会建立一个新绑定
for (const key in obj) {
  funcs.push(function () {
    console.log(key)// 一样输出a b c  惟一的区别是循环内不能更改key的值
  })
}
funcs.forEach(function (func) {
  func()
})

下面的这个例子则会报错，由于在for循环中更改了i的绑定而const常量不能更改绑定

var funcs = []
for (const i = 0; i < 10; i++) {
  funcs.push(function () {
    console.log(i)
  })
}
funcs.forEach(function (func) {
  func()
})

七、全局做用域绑定
当var被做用于全局做用域时，它会建立一个新的全局变量做用全局对象（浏览器环境中的window对象）的属性，这意味着用var极可能会无心中覆盖一个已经存在的全局变量

从上图代码中看出即使是全局对象RegExp Array都会被覆盖
可是let或const会在全局做用域下建立一个新的绑定，但该绑定不会添加为全局对象的属性，换句话说用let或const不能覆盖全局变量，而只能遮蔽它

这个时候的RegExp和window.RegExp是不相同的

let RegExp='hello'
console.log(RegExp) //hello
console.log(window.RegExp===RegExp)//false

const ncz='hi'
console.log(ncz)
console.log("ncz" in window)

最佳实践：默认使用let而不是var默认使用const，只有确实须要改变变量的值时使用let