[JavaScript] 猿でもわかるクロージャ超入門 2 関数の中の関数

クロージャとは関数である。

ずばり言います。
クロージャとは、関数である
まずココがポイント。

次に、たいていの場合、
クロージャとは関数の中の関数である
これで、クロージャのことを30%程度は理解したことになります。

だから、
「クロージャーって何?」
って誰かに聞かれたら、
「ああ、関数の中に書く関数のことでしょ」
って答えとけば、30%ぐらい正解ということになります。(w

関数の中の関数

Javascriptでは、関数の中に関数を書くことができます。
もうちょっと正確に言うと、関数の中で別の関数を定義することができます。
//関数の中で関数を定義

function outer(){
    function inner(){
        alert("hello");
    }
}
ここで、関数innerを呼び出すにはどうしたらいいでしょうか?
下記のコードをコピペして、デスクトップに.htmlファイルとして保存して、ブラウザで開いてみてください。
<script>
function outer(){
    function inner(){
        alert("hello");
    }
}

inner(); // エラー!
</script>
これはエラーになるか、もしくは何も表示されません。
innerはouter関数の中だけで通用するローカルな名前であって、 グローバル空間でinnerは定義されていないからです。
ではやり方を変えてみましょう。
<script>
function outer(){
    function inner(){
        alert("hello");
    }
}

outer(); // 何も起こらない!
</script>
これは、エラーにはなりませんが、やはり何も表示されません。
outer( )は実行されたものの、outer内のinnerは宣言されただけで実行(呼び出し)されていないからです。

innerを実行するには、outer内でinner( )を明示的に実行してやる必要があります。
<script>
function outer(){
    function inner(){
        alert("hello");
    }
    inner();  //←コレ
}

outer(); // "hello"と表示された!
</script>
おめでとうございます。
見事"hello"が表示されましたね。

outer( )が呼び出されたとき、outer内でまずinnerが宣言され、その直後にinner( )が実行されたのです。

これで、あなたはクロージャを30%程度理解したことになります。

「関数の中の関数」をもうちょっと進化させると、クロージャを作ることができます。
でももうちょっとだけ辛抱してください。
その前に、あと2つ別のテクニックを覚える必要があります。

次の記事  猿でもわかるクロージャ超入門 3 無名関数
カテゴリ: