JavaScript的函數聲明與函數表達式的區別

　1)函數聲明(Function Declaration);

    // 函數聲明
    function funDeclaration(type){
        return type==="Declaration";
    }

　　

    2)函數表達式(Function Expression)。

    // 函數表達式
    var funExpression = function(type){
        return type==="Expression";
    }

 

Javascript 中函數聲明和函數表達式是存在區別的，函數聲明在JS解析時進行函數提升，因此在同一個作用域內，不管函數聲明在哪里定義，該函數都可以進行調用。而函數表達式的值是在JS運行時確定，並且在表達式賦值完成后，該函數才能調用。這個微小的區別，可能會導致JS代碼出現意想不到的bug,讓你陷入莫名的陷阱中。如下代碼：

 

1     funDeclaration("Declaration");//=> true
2     function funDeclaration(type){
3         return type==="Declaration";
4     }

1     funExpression("Expression");//=>error
2     var funExpression = function(type){
3         return type==="Expression";
4     }

  

      出現上面的錯誤是因為用函數聲明創建的函數可以在函數解析后調用（解析時進行等邏輯處理）；而用函數表達式創建的函數是在運行時進行賦值，且要等到表達式賦值完成后才能調用。其本質原因體現在這兩種類型在Javascript function hoisting(函數提升）和運行時機（解析時/運行時）上的差異。

      上面兩段代碼的函數提升可示意為下圖： 

代碼1段JS函數等同於：

    function funDeclaration(type){
        return type==="Declaration";
    }
    funDeclaration("Declaration");//=> true

代碼2段JS函數等同於：

    var funExpression;
    funExpression("Expression");//==>error
    funExpression = function(type){
        return type==="Expression";
    }