簡單說明一下JS中的函數聲明存在的“先使用，后定義”

首先看一段JS代碼，其中使用了兩種方式聲明了兩個函數，分別在不同的地方調用兩個函數：

<script>
    'use strict';
    // 輸出hello函數
    console.log(hello);
    // 定義hello函數
    function hello(){
        alert("Hello");
    }
    // 輸出hi變量
    console.log(hi);
    // 給hi賦一個函數
    var hi = function(){
        alert("Hi");
    }
    // 輸出變量hi
    console.log(hi);
</script>

在JS中，定義函數有兩種方式，分別是“函數語句”和“表達式”。

    - 針對hello函數，我在還沒有定義它之前就調用了它，並且我定義hello函數使用的“函數語句”定義的方式。

    - 針對hi函數，我使用的是“表達式”的定義方式，也在定義之前和之后調用了該函數。

結果如下所示：

我們可以看到，使用“函數語句”的方式定義的函數可以“先使用，后定義”。而使用“表達式”定義的函數只能“先定義，后使用”。

 

為什么會出現這種情況呢，我談談我個人的理解，如果有不對的地方，希望可以幫我糾正一下：

　　 我們都知道JS默認有一個全局對象window，在運行一段JS代碼時：

　　　　第一步：JS引擎會先掃描整個JS代碼，把所有全局變量都綁定到window對象上，包括hello和hi這兩個變量。此時，window上就有了hello函數（包括函數體）和hi變量（但值為undefined）。

　　　　第二步：開始從第一行執行JS代碼，這時雖然還沒有執行到hello函數的定義語句，但是window中已經有了函數定義了。而沒有執行到hi變量的賦值語句之前，hi變量用於是undefined。

　　綜上所述：導致了兩種函數定義方式導致的“定義”和“使用”的順序不同。

 

為了驗證猜想，我們在JS代碼塊的開頭添加兩行console：

console.log(window.hello);
console.log(window.hi);

輸出結果如下：

這其中也牽涉到了“變量提升”的概念，其實都可以用綁定到window對象上來理解：在執行JS代碼之前，所有的全局變量（包括函數和變量），都會綁定到window對象上，只是函數會包含函數體，變量僅僅是一個undefined。

我只是個新手，如果有理解上的偏差還望指出，萬分感謝！