var 缺陷 ，为啥引入let const

1、var 缺陷【变量覆盖，变量污染】

        正是由于 JavaScript 存在变量提升这种特性，从而导致了很多与直觉不符的代码，这也是 JavaScript 的一个重要设计缺陷

2、通过块级作用域并配合 let 和 const 关键字来修复这种缺陷

2.1、作用域：是指变量和函数的可访问范围，作用域控制着变量和函数的可见性和生命周期。

2.2、es6之前的作用域：全局作用域和函数作用域

全局作用域：中的对象在代码的任何地方都能访问，其生命周期伴随着页面的生命周期

函数作用域：就是在函数内部定义的变量或函数，并且定义的变量或者函数只能在函数内部被访问。函数执行结束之后，函数内部定义的变量被销毁。

es6之后新增  块级作用域

2.3、变量提升

函数中的变量无论是在哪里声明的，在编译阶段都会被提取到执行上下文的变量环境中，所以这些变量在整个函数体内部的任何地方都是能被访问的，这也就是 JavaScript 中的变量提升。

2.4、变量提升所带来的问题

变量在不被察觉的情况下被覆盖

var myname = "极客时间"
function showName(){
  console.log(myname);
  if(0){
    var myname = "极客邦"
  }
  console.log(myname);
}
showName()

本应销毁的变量没有被销毁

function foo() {
  for (var i = 0; i < 7; i++) {
  }
  console.log(i);
}
foo()

2.5、let 和 const

let 和 const 都可以生成块级作用域，但区别是let 声明的变量可以被修改，const 声明的变量不能被修改。

2.6、JavaScript 是如何支持块级作用域的

从执行上下文的角度来讲

 
function foo(){
    var a = 1
    let b = 2
    {
      let b = 3
      var c = 4
      let d = 5
      console.log(a)
      console.log(b)
    }
    console.log(b) 
    console.log(c)
    console.log(d)
}   
foo()

第一步是编译并创建执行上下文

 第二步继续执行代码

 在词法环境内部，维护了一个小型栈结构，栈底是函数最外层的变量，进入一个作用域块后，就会把该作用域块内部的变量压到栈顶；当作用域执行完成之后，该作用域的信息就会从栈顶弹出，这就是词法环境的结构。

第三步变量的查找过程

沿着词法环境的栈顶向下查询，如果在词法环境中的某个块中查找到了，就直接返回给 JavaScript 引擎，如果没有查找到，那么继续在变量环境中查找。