變數提升

變數提升是 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
 

提升是針對宣告的有名函式，匿名函式不可提升