JavaScriptにおけるクロージャと即時関数実行

ご存知の通り、無名関数をその場で実行し、その結果を変数に代入することができます：

javascriptlet result = function() {
  return '!';
}();

console.log(result); // '!'を出力

この場合、即時実行関数を括弧で囲むことがよくあります（必須ではありませんが）。 これは、関数がその場で実行されることを明確にするためです：

javascriptlet result = (function() {
  return '!';
})();

console.log(result); // '!'を出力

ここで、即時実行関数の結果が別の無名関数を返すようにしてみましょう：

javascriptlet func = (function() {
  return function() {
    console.log('!');
  }
})();

func(); // '!'を出力

返される関数が、クロージャ内に変数 num を保持するようにしてみます：

javascriptlet func = (function() {
  let num = 1;
  
  return function() {
    console.log(num);
  }
})();

num++ を追加すると、関数 func は完成したカウンターになります：

javascriptlet func = (function() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  }
})();

func(); // 1を出力
func(); // 2を出力
func(); // 3を出力
func(); // 4を出力
func(); // 5を出力