1つの記事でJavaScriptのクロージャ関数について学ぶ

変数のスコープ

JavaScript クロージャを理解するには、まず JavaScript 変数のスコープを理解する必要があります。

変数スコープには、グローバルとローカル（グローバル変数とローカル変数）の2種類があります。

JavaScript では、グローバル変数を関数内で直接読み取ることができます。

変数 n=10
関数fn(){
	警告する
}
関数() //10

関数内の変数は関数外から読み取ることはできません。

関数fn(){
	var n = 10;
}
関数()
alert(n) //nは定義されていません。関数は関数外からnを読み取ることができません。

注意: 関数内で変数を宣言するために var が使用される場合、その変数はローカル変数です。var が使用されていない場合、その変数はグローバル変数です。

例えば：

関数fn(){
	10;
}
関数()
警告(n) //10

さらに、関数パラメータもローカルであり、関数内でのみ機能します。

通常の状況では、関数内でローカル変数を取得することはできません。唯一の回避策は、関数内で別の関数を宣言することです。

関数f1(){
	var n = 10;
	関数f2(){
		警告する
	}
}

f2 関数は f1 関数内のすべてのローカル変数を取得できますが、f1 関数は f2 関数内のローカル変数を取得できません。これは、JavaScript 言語に固有の「チェーンスコープ」構造です。 (つまり、子オブジェクトは一度に 1 レベルずつすべての親オブジェクトの変数を検索します)。そのため、親オブジェクトのすべての変数は子オブジェクトに表示されます。

f2 関数は親関数 f1 のローカル変数を取得できます。f2() 関数が返された場合、f1() 関数内の変数は f1 関数の外部からアクセスできます。

例えば：

関数f1(){
	var n = 10;
	関数f2(){
		警告する
	}
	f2() を返す
}
f1() //ページポップアップ10

例の f2() 関数はクロージャ関数です。

閉鎖の概念

スコープの理由により、関数内で定義された変数に関数の外部からアクセスすることはできませんが、場合によってはこの必要があるため、クロージャの概念が登場します。

クロージャは、別の関数のスコープ内の変数にアクセスできる関数です。

上記の例では、内部関数 f2 はクロージャ関数です。

本質的に、クロージャは関数の内部と関数の外部を接続するブリッジです。
クロージャはプライベート変数を保護するためのメカニズムです。関数の実行時にプライベートスコープを形成し、内部のプライベート変数を外部からの干渉から保護します。

クロージャの使用

（１）親スコープ関数内の変数を読み取ることができます。

（２）変数の値は常にメモリに格納され（ローカル変数をグローバル変数にする）、ガベージコレクション機構によってクリアされない。

クロージャのデメリット

クロージャは関数内のすべての変数をメモリに保存し、ガベージコレクションメカニズムはそれらをクリーンアップしないため、メモリ消費量は非常に大きくなります。したがって、クロージャを乱用しないでください。そうしないと、メモリリークが発生する可能性があります。

補充:

メモリリークとは何ですか?

プログラムを実行するにはメモリが必要です。メモリの要求が行われるたびに、オペレーティングシステムはそれを供給する必要があります。
アプリケーション内の一部のコード変数がメモリを使用する必要がなくなったにもかかわらず、オペレーティングシステムまたは使用可能なメモリプールによって再利用されない場合は、メモリリークが発生していることを意味します。

つまり、メモリの一部が不要になったとしても、それはまだ存在するのです - メモリリーク

クロージャによって発生するメモリリークの問題を解決します。

関数を終了する前に、未使用のローカル変数をすべて削除します。

たとえば、現在の変数の値を「null」に設定すると、ガベージコレクションメカニズムが開始すると、値が「null」のこれらの変数は自動的にリサイクルされます。

最後に、クロージャのメリットとデメリットをまとめてみましょう。

利点

①関数内の変数のセキュリティを保護し、カプセル化を実装し、変数が他の環境に流れて名前の競合が発生するのを防ぎます。

② キャッシュ用に変数をメモリ上に保持する（ただし、過度の使用はメモリを消費するためデメリットもある）

③匿名の自己実行関数はメモリ消費量を削減できる

危害

① 上記の点の 1 つは、参照されたプライベート変数を破棄できないため、メモリ消費量が増加し、メモリリークが発生することです。解決策は、変数を使用した後に手動で null を割り当てることです。

②次に、クロージャはクロスドメインアクセスを伴うため、パフォーマンスの低下を引き起こします。クロススコープ変数をローカル変数に格納し、ローカル変数に直接アクセスすることで、実行速度への影響を軽減できます。

要約する

JavaScript クロージャ関数に関するこの記事はこれで終わりです。JavaScript クロージャ関数に関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: