読者です 読者をやめる 読者になる 読者になる

クロージャのメモ

java script

ドラゴンボールのキャラ名みたいなこの【クロージャ】というやつをメモ。。。
自分用メモなので、読みにくくてもあしからず・・・。

参考にしたサイト様

JavaScript 猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記
猿並みの僕でもわかりました。


nothing but ordinary - JavaScript はじめてのクロージャ入門
まとまってます。


for 文と無名関数のイディオム - IT戦記
クロージャについてじゃなくて、javascriptの関数の書き方全体について


JavaScriptの巧い書き方 - Archiva
書き方の勉強になりました。

クロージャとは

これは勉強してみて思ったけど、クロージャを文章で学習するのはまず無理。


だって、

クロージャ (クロージャー、Closure) は、プログラミング言語において引数以外の変数を実行時の環境ではなく、自身が定義された環境(静的スコープ)において解決する関数のことである。

こんなこと言われてもわけわからんし。。


クロージャとは、、、

f(); //1
f(); //2
f(); //3
//呼び出すたびに戻り値がインクリメントされる関数

こんなんや

var tanaka = generateAgeCounter('1984-06-24');
console.log(tanaka('2008-02-18')); // => 23
console.log(tanaka('1999-07-31')); // => 15
//ある誕生日の人に、もう一つ日付を引数で渡すと、その時点での年齢を返す関数

を実現できるものです。
※どちらの問題も、参考にした2サイト様より引用

まずは、javascriptの関数を知ろう。

javascriptの関数の書き方をいろいろ知るところからはじめる。


javascriptで関数をおさらい - 雑想空間


次に、javascriptには関数内関数というものがあると知る。

var f1 =function() {
    return function() {
        alert("inner function text");
    }
}

f1という名前で無名関数を戻り値とする関数を定義する。


使い方は、

var f2 = f1();
f2();    //inner function text

こんな感じ。


余計な変数を使いたくなければ、

var f1 =function() {
    return function() {
        alert("inner function text");
    }
}();
f1();       //inner function text

これでもいいかな。
f1関数の最後に、()を付けてみました。

ほぼほぼクロージャ

これでほぼほぼクロージャだけどあとちょっと足りない。
これはただの無名関数を返す関数。


足りないものは、変数。


関数内に変数がない
こいつに変数を持たせる。

var f = function() {
    var i = 0;
    return function() {
        alert(++i);
    }
}();

var i という変数を持たせて見ました。


この変数は、外側の関数内で定義し、内側の関数から参照します。
ここで関数fを呼び出してみましょう。(正確には関数fの戻り値の無名関数の呼び出し)

f();    //1
f();    //2
f();    //3

ほい。クロージャ。


変数iの状態を保持してくれる関数の完成です。



以下メモのメモ。

  • 返す関数が無名関数である必要はない。
  • 関数内関数がクロージャ。外の関数がエンクロージャらしい。
  • 動きがオブジェクトと似ている。