トップページ >  JavaScript >  クロージャ
初版2013/03/04: 最終更新日2013/03/04
  クロージャ
目次
クロージャ
クロージャ
クロージャとは、戻り値として関数を返す関数のことをクロージャといいます。
関数を返す関数なのでそのままですが、例えば以下のような関数です。



以下、ソースです。

<input type="button" value="a()" onclick="a()();" />
<script Language="Javascript">
<!--
function a(){
    var cnt = 0;
    return function(){
        alert(cnt);
        cnt = cnt + 1;
    }
}
// -->
</script>

戻り値の関数を実行するためにa()()としています。ただ、何度押しても0が表示されます。
ちなみに関数を連続して実行してみます。以下のボタンを押してください。



以下、ソースです。

<input type="button" value="b()" onclick="b();" />
<script Language="Javascript">
<!--
function b(){
  a()();
    a()();
    a()();
}
// -->
</script>

これも0が連続して表示されるだけです。

では、a()の関数を変数に代入して実行してみます。



<input type="button" value="c()" onclick="c();" />
<script Language="Javascript">
<!--
function c(){
    var d = a();
    d();
    d();
    d();
}
// -->
</script>

今回はちゃんとインクリメントされました。このように値を保持するのをいわゆるクロージャといいます。
ということは、以下のようなインスタンスを生成した場合、値はそれぞれ保持されるわけです。



<input type="button" value="d()" onclick="d();" />
<script Language="Javascript">
<!--
function d(){
    var e = a();
    e();
    e();
    e();
    var f = a();
    f();
    f();
    f();
}
// -->
</script>