Einfaches Verständnis von JavaScript-Abschlüssen

Der Verschlussmechanismus ist der Schwerpunkt und die Schwierigkeit von JavaScript. Dieser Artikel soll jedem helfen, Schließungen leicht zu erlernen. Werfen wir einen Blick darauf mit dem Editor unten

Zusammenfassung

Der Abschlussmechanismus ist der Schwerpunkt und die Schwierigkeit von Javascript. Dieser Artikel soll jedem helfen, Abschlüsse leicht zu lernen

1. Was ist Schließung?

Ein Abschluss ist eine Funktion, die auf Variablen im Rahmen einer anderen Funktion zugreifen kann.

Im Folgenden werden gängige Methoden zur Schließungsimplementierung aufgeführt und das Konzept der Schließung anhand von Beispielen erläutert

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

f1 ist die übergeordnete Funktion von f2 und f2 wird einer globalen Variablen (Rückgabewert) zugewiesen. Dies führt dazu, dass sich f2 immer im Speicher befindet und die Existenz von f2 von f1 abhängt. Daher befindet sich f1 immer im Speicher und wird nach Abschluss des Aufrufs nicht vom Speicherbereinigungsmechanismus (Garbage Collection) recycelt, der einen Abschluss bildet.

Es kann also so verstanden werden. Der Abschlussmechanismus besteht darin, dass, wenn Funktion A auf eine Variable einer anderen Funktion B verweist, A jedoch nach der Rückkehr von B immer noch nicht zurückkehrt, aufgrund der Referenz von A immer noch alle von B vorhanden sind Lokale Variablen werden nicht abgemeldet, wenn B beendet, und bleiben bestehen, bis A sich abmeldet. Zu diesem Zeitpunkt ist A der Abschluss.

2. Der This-Zeiger des Verschlusses

Verschlüsse werden normalerweise in der globalen Umgebung aufgerufen, daher zeigt dieser normalerweise auf das Fenster, das wird in bestimmten Situationen immer noch benötigt. Kurz gesagt, dies weist auf die Ausführungsumgebung hin.

Wenn das This des Abschlusses auf das enthaltende

Objekt des Abschlusses zeigen soll, müssen Sie das This des enthaltenden Objekts als Variable an den Abschluss übergeben.

3. Bei der Verwendung von Verschlüssen zu beachtende Punkte

1. Da Verschlüsse dazu führen, dass die Variablen in der Funktion im Speicher gespeichert werden, ist der Speicherverbrauch höher ist sehr groß, sodass Schließungen nicht missbraucht werden können. Andernfalls führt dies zu Leistungsproblemen auf der Webseite und kann zu Speicherverlusten im IE führen. Die Lösung besteht darin, alle nicht verwendeten lokalen Variablen zu

   zu löschen, bevor die Funktion beendet wird.

2. Der Abschluss ändert den Wert der Variablen innerhalb der übergeordneten Funktion außerhalb der übergeordneten Funktion. Wenn Sie also die übergeordnete Funktion als Objekt (

   Objekt), den Abschluss als öffentliche Methode (Öffentliche Methode) und die internen Variablen als private Eigenschaften (privater Wert) verwenden, , müssen Sie darauf achten, den Wert der internen Variablen der übergeordneten Funktion nicht zufällig zu ändern.

Lösen Sie eine häufige Abschlussfrage im Vorstellungsgespräch

Frage:

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);
  }
  }
 }

Lösung

1. Fügen Sie außen eine Funktionsebene hinzu und übergeben Sie i als

Funktionsparameter. Die Variablen innerhalb der Funktion werden jedes Mal gespeichert und befinden sich nicht im selben Speicherbereich wie das externe i. Bei jedem Aufruf der Funktion wird eine lokale Variable generiert, sodass sichergestellt werden kann, dass die Werte jedes Mal gespeichert werden sich nicht gegenseitig beeinflussen.

for(var i = 0; i<arr.length;i++){
 arr[i].onclick = (function(arg){
  return function () {
   alert(arg);
  }
 })(i);
}

2. Verwenden Sie das neue ES6-Let und ändern Sie die Variable i der

for-Schleife in let i, sodass das aktuelle i nur in diesem Zyklus, also in jedem Zyklus, gültig ist i ist eigentlich eine neue Variable. Sie fragen sich vielleicht: Wenn die Variable i in jeder Runde der Schleife neu deklariert wird, woher kennt sie dann den Wert der vorherigen Runde und berechnet so den Wert dieser Runde? Dies liegt daran, dass sich die Javascript-Engine intern den Wert des vorherigen Zyklus merkt und beim Initialisieren der Variablen i dieses Zyklus die Berechnungen auf der Grundlage des vorherigen Zyklus durchgeführt werden.

Das obige ist der detaillierte Inhalt vonEinfaches Verständnis von JavaScript-Abschlüssen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!