JavaScript クロージャーを簡単に理解する

クロージャ メカニズムは JavaScript の焦点であり、難しさです。この記事は、誰もがクロージャを簡単に学ぶのに役立つことを願っています。以下のエディターで見てみましょう

概要

クロージャーのメカニズムは Javascript の焦点であり、難しいものです。この記事は、誰もがクロージャーを簡単に学ぶのに役立つことを願っています

1. クロージャーとは何ですか?

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

一般的なクロージャ実装メソッドを以下にリストし、クロージャの概念を例で説明します

function f1(){
　　　　var n=999;
　　　　nAdd=function(){n+=1}
　　　　function f2(){
　　　　　　alert(n);
　　　　}
　　　　return f2;
　　}
　　var result=f1();
　　result(); // 999
　　nAdd();
　　result(); // 1000

f1 は f2 の親関数であり、f2 はグローバル変数 (戻り値) に割り当てられ、f2 は常にはメモリ内に存在し、 f2 の存在は f1 に依存するため、 f1 は常にメモリ内にあり、呼び出しの完了後にガベージ コレクション メカニズム (ガベージ コレクション) によってリサイクルされず、クロージャが形成されます。

つまり、このように理解できます。 クロージャのメカニズムは、関数 A が別の関数 B の変数を 参照しているが、B が戻っても A が返らない場合、A の参照のため、B のすべてのローカル変数は B に従わないということです。 終了 してログアウトすると、A がログアウトするまで存在します。この時点では A がクロージャです。

2. クロージャの this ポインタ

クロージャは通常、グローバル環境で呼び出されるため、通常、これは実行環境に依存します。環境。

クロージャの this がクロージャを含む

オブジェクト を指す必要がある場合は、含まれるオブジェクトの this を変数としてクロージャに渡す必要があります。

3. クロージャを使用する際の注意点

1. クロージャを使用すると関数内の変数がメモリに格納され、大量のメモリを消費するため、クロージャを乱用することはできません。そうしないと、パフォーマンスの問題が発生します。 Web ページで、IE でメモリ リークが発生する可能性があります。解決策は、関数を終了する前に、未使用のローカル変数をすべて削除することです。
   クロージャは、親関数内の変数の値を親関数の外で変更します。したがって、親関数をオブジェクト (
オブジェクト
2. ) として使用し、クロージャーをそのパブリック メソッド (パブリック メソッド) として使用し、内部変数をそのプライベート

   プロパティ (プライベート値) として使用する場合は、次のことを行わないように注意する必要があります。親関数内の変数の値を変更します。

4. クロージャ面接の一般的な質問を解決します

問題:

解決策

1. 関数のレイヤーを外側に追加し、関数パラメーターとして i を使用します。 パス関数内に保存された変数が外部 i と同じメモリ空間に存在しないように、関数が呼び出されるたびにローカル変数が生成されるため、値が保存されることが保証されます。毎回は相互に影響しません。

function onMyLoad(){
  /*
  抛出问题:
  此题的目的是想每次点击对应目标时弹出对应的数字下标 0~4,但实际是无论点击哪个目标都会弹出数字5
  问题所在:
  arr 中的每一项的 onclick 均为一个函数实例(Function 对象),这个函数实例也产生了一个闭包域,
  这个闭包域引用了外部闭包域的变量,其 function scope 的 closure 对象有个名为 i 的引用,
  外部闭包域的私有变量内容发生变化,内部闭包域得到的值自然会发生改变
  */
  var arr = document.getElementsByTagName("p");
  for(var i = 0; i < arr.length;i++){
  arr[i].onclick = function(){
   alert(i);
  }
  }
 }

2. ES6 の新しい let を使用して、for ループ

の変数 i を let i に変更します。これにより、現在の i はこのサイクルでのみ有効になり、各サイクルの i は実際には新しい変数になります。変数 i がループの各ラウンドで再宣言される場合、どのようにして前のラウンドの値を知り、このラウンドの値を計算するのかと疑問に思われるかもしれません。これは、JavaScript エンジンが内部的に前のサイクルの値を記憶しており、このサイクルの変数 i を初期化するときに、前のサイクルに基づいて計算が実行されるためです。

以上がJavaScript クロージャーを簡単に理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。