モダンJavaScript Deep Dive-3


24個のエンクロージャ
🏀 Closerとは?
エンクロージャは、関数と宣言されたディレクトリ環境と組み合わせて使用されます.すなわち、ネスト関数が外部関数よりも長く保持されている場合、ネスト関数は、ライフサイクルが終了した外部関数の変数を参照することができる.また,これらのオーバーラップ関数をCloserと呼ぶ.
文字だけではわかりにくいので、下のコードを見てみましょう.

const x = 1;

function outer(){
  const x = 10;
  const inner = function(){console.log(x);};
  return inner;
}

const innerFunc = outer();
innerFunc();
上のコードでouter関数を呼び出すと、埋め込み関数が返されます.その後、outer関数の実行コンテキストが実行コンテキストスタックからポップアップされ、削除されます.これによりouter関数はライフサイクルを終了します.したがって、outer関数の領域変数xと変数値10もライフサイクルを終了する.したがって、上記のコードは1を返す必要がある場合があります.
ただし、上記のコードは10の値を返します.いったいどういうことですか.
埋め込み関数は、ライフサイクルが終了した外部関数、すなわちouter関数の変数を参照することができるので、これは可能である.そしてここで内関数をCloserと呼ぶ.
🏀 利用モジュール
では、なぜロッカーをどのように使うのでしょうか.
エンクロージャは、安全にステータスを変更および維持するために使用されます.すなわち,状態の予期せぬ変更を防止するために,状態を安全に非表示にし,特定の関数のみが状態を変更できるようにする.
次のコードを見てみましょう.
const increase = (function () {
  //카운트 상태 변수
  let num = 0;
  //클로저
  return function() {
    //카운트 상태를 1만큼 증가시킨다. 
    return ++num
  };
}()};

console.log(increase()); //1
console.log(increase()); //2
console.log(increase()); //3
上記のコードが実行されると、直ちに実行関数が呼び出され、直ちに実行関数が返す関数がインクリメンタル変数に割り当てられる.increate変数に割り当てられた関数は、定義された位置によって決定される親スキャンプログラムが関数を即時に実行するディレクトリ環境を記憶するレコーダです.
インスタント実行関数は呼び出し後に破棄されますが、インスタント実行関数が返すモジュールはインクリメンタル変数に割り当てられて呼び出されます.したがって、即時実行関数が返すモジュールは、カウント状態を維持するために自由変数numを参照して変更することができる.
即時実行関数は1回のみ実行されるため、num変数は呼び出しが増加するたびに再初期化されません.またnum変数は外部から直接アクセスできない非表示変数であるため、グローバル変数を使用する場合のように予期せぬ変更を心配する必要がないため、信頼できるプログラミングが可能である.
注意:モダンJavaScript Deep Dive