JavaScriptのクロージャ

2010/06/18

JavaScriptは関数の中の関数で埋め尽くされていて、 合理的とは言え、非常に解読が非常に難しい。 場合によっては、一つの関数の中に全て網羅されてしまってるソースもある。

つまりは、カッコをいかに読めるか?(KY)が重要であるw

■関数内の関数


function calculate() {
    function hogehoge() {
    }
}

■無名関数


var hoge = function (){}

まぁ、ここまでは大丈夫でしょう。

■無名関数の即時実行


(function(){})();

■関数内の関数を無名関数で即時実行 タイトルの時点でわかりにくいが・・・


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

var func = calculate();
func();

■クロージャーの存在意義 クロージャーを使うと、内部の状態が保持されます。


function calculate() {
    var count = 0;
    return function() {
        count = count + 1;
        alert(count);
    };

}
var func = calculate(); 
func();
func();
func();

このサンプルでは、1,2,3と出力されます。 ちなみにfunc()部分を以下にすると、常に1が出力されます。


(calculate())();
(calculate())();
(calculate())();

ただ個人的な感想としては、関数ではなくクラスでインスタンス変数を持った方が 混乱が少ないように思えますが(^_^;)