JavaScripts之变量作用域提升问题(var、let、const)

• 变量提升（Hoisting）
  1. var: 使用var在函数或全局内任何地方声明变量相当于在其内部最顶上声明它，这种行为称为Hoisting（提升）

  注意：变量赋值的位置不会改变

    function fn() {
       console.log(x) // -> undefined
       var x = 2
    }
    // 等同于：
    function fn() {
      var x // 变量提升到函数最顶部
      console.log(x)
      x = 2 // 赋值的位置不变
    }
  

  1. let/const: 使用 let/const 定义变量是存在块级作用域({...})的，它同样存在变量提升，但是由于有临时死区的概念，导致变量在未初始化的时候是不能够使用的（所以看上去是没有变量提升的）

    function fn() {
      console.log(x) // 报错 ->  Cannot access 'name' before initialization
      // var -> let 使得 x 存在临时死区，在未初始化之前是无法被使用的
      let x = 2
    }
    // 正确方式
    function fn() {
      let x = 2 // 定义并初始化
      console.log(x) // -> 2
    }
  

• 变量的作用域
  
  var：只存在函数作用域和全局作用域

    // 使用 var 在函数外部定义变量，会提升到全局作用域
    var globalA = c
    function fn() {
      if(true) {
        // 会在函数顶部定义 a = undefind, 所以在下方的console.log中能够正常输出
        // 这里其实是 a = 1 赋值的步骤
        var a = 1
      }
  
      console.log(a) // -> 1
    }
  

  const/let: 局部作用域({ ... })

    console.log(curA) // -> Cannot access 'curA' before initialization
    // 只能在初始化后才能使用 curA
    const curA = 'ccc'
    console.log(curA) // -> 'ccc'
    function fn() {
      if(true) {
        console.log(a) // a is not defined
      }
      let a = 1
    }