by shigemk2

当面は技術的なことしか書かない

クロージャ

クロージャ - Wikipedia

公式には

引数以外の変数を実行時の環境ではなく、自身が定義された環境(静的スコープ)において解決する。

と書かれてるけど、そう言われても理解できないので、コードを見たほうがいいです。

このような

function newCounter() {
    var i = 0;
    return function() { // 無名関数
        i = i + 1;
        return i;
    }
}

c1 = newCounter();
console.log(c1()); // 1
console.log(c1()); // 2
console.log(c1()); // 3
console.log(c1()); // 4
console.log(c1()); // 5

c1 に代入された無名関数は newCounter 内のローカル変数 i を参照している。 c1 を呼び出すたびに i はインクリメントされていく。
というか、iが関数newCounterを実行したあとも、変数iの値が保持されているのだ。

失敗例

function newCounter() {
    return function() {
        i = i + 1;
        return i;
    }
}
var i = 0;
console.log(newCounter()); // [Function]
console.log(newCounter()); // [Function]
console.log(newCounter()); // [Function]

クロージャを使えてない。(外からの変数を利用しているから)

function newCounter() {
    function hoge() {
        i = i + 1;
        return i;
    }
    return hoge();
}
var i = 0;
console.log(newCounter()); // 1
console.log(newCounter()); // 2
console.log(newCounter()); // 3

というかjavascriptのクロージャは、こちらを見ればいいんじゃあないかなって思ってる。
[JavaScript] 猿でもわかるクロージャ超入門 1 問題 - DQNEO起業日記