JavaScriptにおけるクロージャーを使ったカウンター

以前に検討したコードを書き直して、 返される関数が変数 num の値を 毎回1ずつ増加させるようにしてみましょう：

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++; // 1を加算
  }
}

let func = test();

結果として、関数 func を呼び出すたびに コンソールに新しい値が表示されることになります：

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  }
}

let func = test();

func(); // 1を表示
func(); // 2を表示
func(); // 3を表示
func(); // 4を表示
func(); // 5を表示

これで、クロージャー（より正確には、関数の クロージャーにある変数 num）を 使って関数呼び出しのカウンターを実装できた ことになります。

注意点として、関数 test を呼び出すたびに 新しい関数が返され、それぞれが独自の クロージャーを持ちます。つまり、異なる カウンターは独立して動作します：

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  };
}

let func1 = test(); // 1つ目のカウンター
func1();  // 1を表示
func1();  // 2を表示

let func2 = test(); // 2つ目のカウンター
func2();  // 1を表示
func2();  // 2を表示

つまり、同じ変数 num が異なる関数に対して 異なる値を持つことになるのです！

関数 test を2回呼び出した場合、 そこから得られる関数は独立して動作し、 各関数は独立した変数 num を 持つことになります。