ホームページ > 記事 > ウェブフロントエンド > JavaScript クロージャを理解する: 包括的なガイド
クロージャは JavaScript の基本的な概念であり、外部関数の実行が終了した後でも、内部関数がその外部 (囲んでいる) 関数の変数とパラメーターにアクセスできます。簡単に言うと、クロージャーを使用すると、関数が別のスコープで実行される場合でも、関数がその外部スコープの変数を「記憶」してアクセスできるようになります。
JavaScript のすべてのクロージャーは 3 つのスコープにアクセスできます:
基本的な例で字句スコープを理解しましょう:
function init() { var name = "Mozilla"; // local variable created by init function displayName() { // inner function console.log(name); // uses variable declared in parent function } displayName(); } init();
この例では:
クロージャを示す、少し変更されたバージョンを見てみましょう:
function makeFunc() { const name = "Mozilla"; function displayName() { console.log(name); } return displayName; } const myFunc = makeFunc(); myFunc();
理解すべき重要なポイント:
クロージャの力を示す、より実践的な例を次に示します。
function makeAdder(x) { return function(y) { return x + y; }; } const add5 = makeAdder(5); const add10 = makeAdder(10); console.log(add5(2)); // outputs 7 console.log(add10(2)); // outputs 12
何が起こっているのかを詳しく見てみましょう:
同じ関数定義を共有します
しかし、それらは異なる語彙環境を持っています
add5 の環境では、x は 5
add10 の環境では、x は 10
クロージャは次のことを可能にするため強力です:
クロージャは最新の JavaScript パターン、フレームワーク、ライブラリで広く使用されているため、JavaScript 開発者にとってクロージャを理解することは非常に重要です。これらは、コードをクリーンで保守しやすく保ちながら、プライベート変数を作成し、関数型プログラミングで状態を維持する方法を提供します。
覚えておいてください: クロージャは、別の関数内の単なる関数ではありません。クロージャは、外側のスコープ内の変数にアクセスでき、外側の関数の実行が終了した後もそのアクセスを維持する関数です。
以上がJavaScript クロージャを理解する: 包括的なガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。