变量提升与函数提升

变量提升

变量提升是 JavaScript 中比较“奇怪”的现象，它允许在变量声明之前即被访问（仅存在于var声明变量）

变量提升流程：

1. 先把var 变量提升到当前作用域于最前面
2. 只提升变量声明， 不提升变量赋值
3. 然后依次执行代码

注意：

1. 变量没有声明即被访问时会报语法错误

   Uncaught ReferenceError: 变量名 is not defined

2. 变量在var声明之前即被访问，变量的值为 undefined

3. let/const 声明的变量不存在变量提升

4. 变量提升出现在相同作用域当中

5. 实际开发中推荐先声明再访问变量

// var n
    console.log(n)//undefined

    var n = 123

    console.log(n)//123

    function fn () {
      // var n
      console.log(n)//undefined

      var n = 666

      console.log(n)//666

    }
    // 函数调用时，预解析，首先查找当前作用域是否声明变量，声明了，预解析声明的变量，放在当前作用域最前面
    fn()

预解析：代码执行前先要预解析（调用才预解析）

• 变量：带有声明的变量会有预解析

  把变量的声明语法提升到当前作用域的最前面

? 注意：只定义不赋值，也称为变量提升

• 函数：带有名字的函数

  把函数的声明语法，提到当前作用域最前面

? 注意：只定义不调用，也称为函数提升

    // 预解析，放在当前作用域最前面
    /* 预解析
    var a
    var b
     */
    
    // 函数调用时，函数预解析，函数提升
    /* 预解析
      function fn() {
        // 变量提升
        var b = 20
        var a
        console.log(a)//undefined
        console.log(b)//20
        var a = 10
      }
     */

    var a = 1
    var b = 2

    fn()

    function fn() {
      
      var b = 20
      console.log(a)//undefined
      console.log(b)//20
      var a = 10

    }

函数提升

函数提升与变量提升比较类似，是指函数在声明之前即可被调用。

总结：

1. 函数提升能够使函数的声明调用更灵活

2. 函数表达式不存在提升的现象

3. 函数提升出现在相同作用域当中

    // 函数提升
    fn()

    function fn () {
      console.log(123)
    }

    // 函数表达式不能提升，需要先声明，再使用
    // 
    // const f = function () {
    //   console.log(222)
    // }
    // f()

    // 函数优于变量
    // 变量与函数同名时，函数优于变量
    /* 
    a:函数
    a:变量
     */

     console.log(a)
     /* 控制台打印
     ? a () {
       console.log('a')
     }
      */

     function a () {
       console.log('a')
     }

     var a = 1
     console.log(a)//1

提升是针对声明的有名函数，匿名函数不可提升