Detaillierte Erläuterung des Schreibens und der Funktion von Schließungen in JavaScript

1. Was ist eine Schließung?

Ein Verschluss ist eine Funktion, die die Erlaubnis hat, in einem anderen Funktionsbereich auf Variablen zuzugreifen.

Einfach ausgedrückt, ermöglicht JavaScript die Verwendung interner Funktionen - dh Funktiondefinitionen und Funktionsausdrücke befinden sich im Funktionskörper einer anderen Funktion. Darüber hinaus können diese internen Funktionen auf alle lokalen Variablen, Parameter und anderen internen Funktionen zugreifen, die in der externen Funktion, in der sie sich befinden, deklariert sind. Wenn eine dieser internen Funktionen außerhalb der externen Funktion, die sie enthält, aufgerufen wird, wird ein Verschluss gebildet.

2. Der Umfang der Variablen

Um Schließungen zu verstehen, müssen Sie zunächst den Umfang der Variablen verstehen.

Es gibt nur zwei Arten von Variablenarten: globale Variablen und lokale Variablen.

Das spezielle Merkmal der JavaScript -Sprache ist, dass globale Variablen direkt in Funktionen gelesen werden können.

Die Variablen externer Funktionen können in der internen Funktion zugegriffen werden, da die Bereichskette der internen Funktion den Umfang der externen Funktion enthält.

Es kann auch verstanden werden als: Der Wirkungsbereich der internen Funktion wird auf den Wirkungsbereich der externen Funktion ausstrahlt;

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

Andererseits werden lokale Variablen innerhalb der Funktion natürlich nicht außerhalb der Funktion gelesen.

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

Hier gibt es einen Platz zu beachten. Wenn Sie die Variablen intern deklarieren, müssen Sie den Befehl var verwenden. Wenn nicht, deklarieren Sie tatsächlich eine globale Variable!

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

3. Verschiedene Möglichkeiten zum Schreiben und Gebrauch von Schließungen

3.1. Fügen Sie der Funktion einige Eigenschaften hinzu

 Funktionskreis (r) {this.r = r; } Circle.pi = 3.14159; Circle.Prototype.Area = function () {return Circle.pi * this.r * this.r; } var c = neuer Kreis (1.0); Alarm (C.AREA ()); //3.14159

3.2. Deklarieren Sie eine Variable und weisen Sie der Variablen als Wert eine Funktion zu.

 var Circle = function () {var obj = new Object (); obj.pi = 3.14159; obj.area = function (r) {return this.pi * r * r; } return obj; } var c = neuer Circle (); Alarm (C.AREA (1,0)); //3.14159

3.3. Diese Methode wird häufiger verwendet und ist am bequemsten. var obj = {} soll ein leeres Objekt deklarieren

 var circle = {"pi": 3.14159, "Bereich": Funktion (r) {return this.pi * r * r; }}; Alarm (Circle.Area (1.0)); // 3.14159

4. Die Hauptfunktion des Verschlusses

Schließungen können an vielen Stellen verwendet werden. Es hat zwei größte Verwendungen: eine ist, dass die Variablen in der Funktion wie oben erwähnt gelesen werden können, und das andere ist, dass die Werte dieser Variablen immer im Speicher gehalten werden.

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

Aus verschiedenen Gründen müssen wir manchmal lokale Variablen innerhalb der Funktion erhalten. Wie bereits erwähnt, kann dies jedoch unter normalen Umständen nicht erfolgen und kann nur durch Problemumgehungen erreicht werden.

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

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

Im obigen Code ist die Funktion F2 in Funktion F1 enthalten, und alle lokalen Variablen in F1 sind für F2 sichtbar. Aber umgekehrt ist nicht möglich. Lokale Variablen in F2 sind für F1 unsichtbar. Dies ist die "Chain Scope" -Struktur, die für die JavaScript -Sprache einzigartig ist. Die untergeordneten Objekte schauen für alle übergeordneten Objektvariablen auf der Ebene nach oben. Daher sind alle Variablen des übergeordneten Objekts für das untergeordnete Objekt sichtbar, sonst ist es nicht wahr.

Da F2 lokale Variablen in F1 lesen kann, können wir seine internen Variablen außerhalb von F1 nicht lesen, solange F2 als Rückgabewert verwendet wird?

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

4.2. Wie speichern Sie immer den Wert einer Variablen im Speicher?

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

In diesem Code ist das Ergebnis tatsächlich die F2 -Funktion des Verschlusss. Insgesamt wird zweimal ausgeführt, der erste Wert beträgt 999 und der zweite Wert beträgt 1000. Dies zeigt, dass die lokale Variable N in der Funktion F1 im Speicher gehalten wurde und nach dem Aufrufen von F1 nicht automatisch gelöscht wird.

Warum passiert das? Der Grund dafür ist, dass F1 die übergeordnete Funktion von F2 ist und F2 einer globalen Variablen zugeordnet ist, die dazu führt, dass F2 immer im Gedächtnis ist, und die Existenz von F2 hängt von F1 ab. Daher ist F1 immer im Gedächtnis und wird nach Abschluss des Anrufs nicht vom Müllsammlungsmechanismus recycelt.

Ein weiterer bemerkenswerter Punkt in diesem Code ist, dass die Zeile "nadd = function () {n+= 1}" zuerst vor NADD verwendet wird, sodass NADD eine globale Variable ist, keine lokale Variable. Zweitens ist der Wert von NADD eine anonyme Funktion, und diese anonyme Funktion selbst ist ebenfalls ein Verschluss, sodass NADD einem Setter entspricht, der auf lokalen Variablen innerhalb der Funktion außerhalb der Funktion arbeiten kann.

5. Schließungen und dieses Objekt

Die Verwendung dieses Objekts in Schließungen kann einige Probleme verursachen. Da die Ausführung anonymer Funktionen global ist, weist dieses Objekt normalerweise auf das Fenster hin. Der Code ist wie folgt:

 var name = "Das Fenster"; var Object = {Name: "Mein Objekt", getNameFun: function () {return function () {return this.name;};}}; alert (Object.getNameFun () {}); // "das Fenster" (im Nichtstrainungsmodus)

Speichern Sie dieses Objekt im externen Bereich in einer Variablen, auf die durch einen Verschluss zugegriffen werden kann, und der Verschluss kann auf das Objekt zugreifen. Der Code ist wie folgt:

 var name = "Das Fenster"; var Object = {Name: "Mein Objekt", getNameFun: function () {var that = this; return function () {return that.name;};}}; alert (Object.getNameFun () {{}); // "mein Objekt"

6. Schließungen und Speicherlecks

Insbesondere wenn ein HTML -Element im Bereich des Verschlusses gespeichert ist, bedeutet dies, dass das Element nicht zerstört werden kann. wie folgt:

 Funktion ordnungsgemäße () {var element = document.getElementById ("einige

Der obige Code erzeugt einen Verschluss als Ereignishandler von Elementelemente, und dieser Verschluss schafft eine kreisförmige Referenz. Da anonyme Funktionen einen Verweis auf das aktive Objekt von Hafthandler () speichern, ist es nicht möglich, die Anzahl der Verweise auf das Element zu verringern. Solange eine anonyme Funktion existiert, beträgt die Anzahl der Verweise auf das Element mindestens 1, sodass die von ihm belegte Speicherin nicht recycelt wird.

Beheben Sie interne Recyclingprobleme, indem Sie den Code neu schreiben:

 Funktion ordnungsgemäß () {var element = document.getElementById ("einige

Im obigen Code bezieht sich der Implementierungschließ nicht direkt auf Element, und eine Referenz wird weiterhin im aktiven Objekt, das die Funktion enthält, gespeichert. Daher ist es notwendig, die Elementvariable auf Null zu setzen, damit der von ihm belegte Speicher normal recycelt werden kann.

7. Hinweise zur Verwendung von Schließungen

1) Da Verschlüsse dazu führen, dass alle Variablen in der Funktion im Speicher gespeichert werden und der Speicherverbrauch sehr groß ist, können Verschlüsse nicht missbraucht werden, andernfalls verursacht dies Leistungsprobleme auf der Webseite und kann zu einem Speicherleck der IE führen. Die Lösung besteht darin, alle lokalen Variablen zu löschen, die vor dem Verlassen der Funktion nicht verwendet werden.

2) Der Verschluss ändert den Wert der Variablen innerhalb der übergeordneten Funktion außerhalb der übergeordneten Funktion. Wenn Sie die übergeordnete Funktion als Objekt verwenden, verwenden Sie den Verschluss als öffentliche Methode und die interne Variable als private Eigenschaft, achten Sie darauf, den Wert der internen Variablen der übergeordneten Funktion nicht nach Belieben zu ändern.

Das obige ist eine detaillierte Erklärung des Schreibens und der Funktion von Schließungen in JavaScript, die Ihnen vom Editor vorgestellt wurden. Ich hoffe, es wird Ihnen hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird Ihnen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!