[javascript] closure 說明與用法

還記得之前面試時,幾乎快要每家的 javascript 都問到了 closure 使用的地方與觀念。


簡單來說,利用 closure 方法,我們可以做出類似私有變數(private)或是延續變數存活域。

看以上這句,一定一點也不懂XD

由例子來看吧!

假設我們現在想做一個 counter ,每呼叫一次 add() ,就把 count+1

因此可能會寫出如下的程式碼

var count=0;

function add()
{
    count++;
}

這樣的寫法,當我們與其他程式碼放在一起時,可能會有其他開發人員誤改到 count 這個變數。

但我們也不可能寫成

function add()
{
    var count=0;
    count++;
}

因此,我們可以利用 closure 嘗試做出類似 C++ 或 java class 的私有域(private)。

var init=function(init)
{
    return function(){ return init+=1; };
};

var add=init(0);

這以上可以看到,我們其實間接的延長了 init 的存活域,使他保留在函式私有域中。

以上這段程式碼,可能有人問為什麼要多一個 init 函式,其實這邊可以使用 IIFE(Immediately Invoked Function Expression)簡化。

我們其實可以使用 IIFE 寫成下面這樣

var add=(function(init)
{
    return function(){ return init+=1; };
})(0);

參考資料:

http://www.w3schools.com/js/js_function_closures.asp

Leave a Reply