Den Abschluss in Javascript verstehen

Schließung ist eine Schwierigkeit und Funktion der Javascript-Sprache. Viele fortgeschrittene Anwendungen basieren auf Schließungen.

1. Der Umfang von Variablen

Um Abschlüsse zu verstehen, müssen Sie zunächst den speziellen Variablenumfang von Javascript verstehen.

Der Umfang von Variablen besteht lediglich aus zwei Typen: globale Variablen und lokale Variablen.

Das Besondere an der Javascript-Sprache ist, dass globale Variablen direkt innerhalb der Funktion gelesen werden können.

var n=999;
 
　　function f1(){
　　　　alert(n);
　　}
 
　　f1(); // 999

Andererseits können lokale Variablen innerhalb einer Funktion nicht außerhalb der Funktion gelesen werden.

function f1(){
　　　　var n=999;
}
 
alert(n); // error

Hier gibt es etwas zu beachten: Wenn Sie Variablen innerhalb einer Funktion deklarieren, müssen Sie den Befehl var verwenden. Wenn Sie es nicht verwenden, deklarieren Sie tatsächlich eine globale Variable!

function f1(){
　　　　n=999;
　　}
 
　　f1();
 
　　alert(n); // 999

2. Wie lese ich lokale Variablen von außen?

Aus verschiedenen Gründen müssen wir manchmal lokale Variablen innerhalb einer Funktion abrufen. Dies ist jedoch, wie bereits erwähnt, im Normalfall nicht möglich und kann nur durch Workarounds erreicht werden.

Das heißt, eine weitere Funktion innerhalb der Funktion zu definieren.

function f1(){
 
　　　　var n=999;
 
　　　　function f2(){
　　　　　　alert(n); // 999
　　　　}
 
　　}

Im obigen Code ist die Funktion f2 in der Funktion f1 enthalten. Zu diesem Zeitpunkt sind alle lokalen Variablen in f1 für f2 sichtbar. Aber das Gegenteil funktioniert nicht. Die lokalen Variablen in f2 sind für f1 unsichtbar. Dies ist die für die Javascript-Sprache einzigartige „Kettenbereichsstruktur“. Das untergeordnete Objekt sucht Ebene für Ebene nach den Variablen aller übergeordneten Objekte. Daher sind alle Variablen des übergeordneten Objekts für das untergeordnete Objekt sichtbar, umgekehrt jedoch nicht.

Da f2 die lokalen Variablen in f1 lesen kann, können wir seine internen Variablen außerhalb von f1 nicht lesen, solange f2 als Rückgabewert verwendet wird!

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

3. Das Konzept des Abschlusses

Die f2-Funktion im Code im vorherigen Abschnitt ist ein Abschluss.

Die Definition von „Abschluss“ in diverser Fachliteratur ist sehr abstrakt und schwer verständlich. Nach meinem Verständnis ist ein Abschluss eine Funktion, die die internen Variablen anderer Funktionen lesen kann.

Da in der Javascript-Sprache nur Unterfunktionen innerhalb der Funktion lokale Variablen lesen können, können Abschlüsse einfach als „innerhalb einer Funktion definierte Funktionen“ verstanden werden.

Im Wesentlichen ist der Abschluss also eine Brücke, die das Innere einer Funktion mit dem Äußeren der Funktion verbindet.

4. Verwendungsmöglichkeiten von Verschlüssen

Verschlüsse können an vielen Stellen eingesetzt werden. Seine größten Verwendungszwecke bestehen zum einen darin, die Variablen innerhalb der Funktion zu lesen, und zum anderen darin, die Werte dieser Variablen im Speicher zu halten.

Wie ist dieser Satz zu verstehen? Bitte schauen Sie sich den Code unten an.

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

In diesem Code ist das Ergebnis tatsächlich die Abschlussfunktion f2. Es wurde zweimal ausgeführt, beim ersten Mal war der Wert 999, beim zweiten Mal war der Wert 1000. Dies beweist, dass die lokale Variable n in der Funktion f1 immer im Speicher gespeichert ist und nach dem Aufruf von f1 nicht automatisch gelöscht wird.

Warum ist das so? Der Grund dafür ist, dass f1 die übergeordnete Funktion von f2 ist und f2 einer globalen Variablen zugewiesen ist, wodurch f2 immer im Speicher bleibt und die Existenz von f2 von f1 abhängt, sodass f1 immer im Speicher ist und nicht gelöscht wird Nach Abschluss des Anrufs wird es vom Garbage-Collection-Mechanismus recycelt.

Eine weitere erwähnenswerte Sache in diesem Code ist die Zeile „nAdd=function(){n+=1}“. Erstens wird das Schlüsselwort var nicht vor nAdd verwendet, daher ist nAdd eine globale Variable, keine lokale Variable. . Zweitens ist der Wert von nAdd eine anonyme Funktion, und diese anonyme Funktion selbst ist auch ein Abschluss, sodass nAdd einem Setter entspricht, der lokale Variablen innerhalb der Funktion außerhalb der Funktion bearbeiten kann.

5. Zu beachtende Punkte bei der Verwendung von Abschlüssen

1) Da Abschlüsse dazu führen, dass die Variablen in der Funktion im Speicher gespeichert werden, was viel Speicher verbraucht, können Abschlüsse nicht missbraucht werden, da es sonst zu Leistungsproblemen kommt die Webseite, was zu Speicherverlusten im IE führen kann. Die Lösung besteht darin, alle nicht verwendeten lokalen Variablen 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 daher die übergeordnete Funktion als Objekt, den Abschluss als öffentliche Methode und die internen Variablen als privaten Wert verwenden, müssen Sie darauf achten, den Wert der Variablen innerhalb der übergeordneten Funktion nicht zu ändern.

6. Fragen zum Nachdenken

Wenn Sie die Ergebnisse der folgenden beiden Codeteile verstehen können, sollten Sie den Funktionsmechanismus von Schließungen verstehen.

Code-Schnipsel eins

var name = "The Window";
 
　　var object = {
　　　　name : "My Object",
 
　　　　getNameFunc : function(){
　　　　　　return function(){
　　　　　　　　return this.name;
　　　　　　};
 
　　　　}
 
　　};
 
　　alert(object.getNameFunc()());

Code-Schnipsel zwei

var name = "The Window";
 
　　var object = {
　　　　name : "My Object",
 
　　　　getNameFunc : function(){
　　　　　　var that = this;
　　　　　　return function(){
　　　　　　　　return that.name;
　　　　　　};
 
　　　　}
 
　　};
 
　　alert(object.getNameFunc()());

Weitere Programmierkenntnisse finden Sie unter: Einführung in die Programmierung! !

Das obige ist der detaillierte Inhalt vonDen Abschluss in Javascript verstehen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!