談談 JavaScript 的函數表達式及其應用

我們都知道定義函數的方式有兩種，一種是 函數聲明 ，另外一種就是 函數表達式 。

函數聲明

語法為：function關鍵字后跟函數名。例如：

function functionName(arg0) {
    //函數體
}
alert(functionName.name)  // "functionName"

函數聲明最主要的特征就是 函數聲明的提升 ，所以我們可以把函數聲明放在調用它的語句的后面，因為執行代碼前會先讀取函數聲明。比如：

hello();
function hello(){
    alert("hello");
}

上面的代碼可以在瀏覽器正常運行。

函數表達式

語法如下：

var functionName = function(arg0){
    //函數體
};
alert(functionName.name)  // ""

如上所示當我們輸出函數名時返回了空字符串，因為function關鍵字后面沒有標識符，這種情況下創建的函數為匿名函數。接下來我們就談談利用函數表達式所創建的匿名函數有什么應用。

應用

函數表達式最典型的應用就是模仿塊級作用域，我們都知道JavaScript沒有塊級作用域，不過我們可以用函數表達式模仿塊級作用域。形成獨立作用域，從而 避免全局污染 。

操作方法：聲明匿名函數，立馬調用。

最經典的例子：

function createFunctions(){
    var result = [];
    for (var i=0; i < 10; i++){
        result[i] = function(){
            return i;
        };
    }
    return result;
}
createFunctions();

乍一看每個函數都應該返回自己的索引值，即位置0的函數返回0,1的返回1，以此類推。實際上每個函數都將返回10，因為這里的i是貫穿整個作用域的，我們把上面代碼修改一下：

//寫法1
(function(){
    //這里是塊級作用域
    var result = [];
    for(var i=0;i<10;i++){
        result[i] = (function(num){
            return function(){
                return num;
            };
        }(i))();
    }
    return result;
})();   //[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
//寫法2
var hasfunction = function(){
    var result = [];
        for(var i=0;i<10;i++){
            result[i] = (function(num){
                return function(){
                    return num;
            };
        }(i))();
    }
    return result;
}
hasfunction();

在立即執行函數執行的時候，i的值被賦值給num，同時創建返回num的閉包，從而result數組每個函數都有一個num變量的副本。

完。

來自：https://segmentfault.com/a/1190000007393641