Ausführliche Erklärung von Schließungen in Javascript

Vorwort: Dies ist immer noch ein Einführungsartikel. Es gibt mehrere sehr wichtige Sprachfunktionen in Javascript – Objekte, prototypische Vererbung und Abschlüsse. Unter anderem ist Closing eine neue Sprachfunktion für Programmierer, die die traditionelle statische Sprache C/C verwenden. Dieser Artikel beginnt mit Beispielen, um die Sprachfunktionen von Javascript-Verschlüssen vorzustellen, und kombiniert sie mit einigen ECMAScript-Sprachspezifikationen, um den Lesern ein tieferes Verständnis von Verschlüssen zu ermöglichen.

Hinweis: Bei diesem Artikel handelt es sich um einen Einführungsartikel. Wenn Sie ein Experte sind, können Sie gerne technische Vorschläge und Meinungen zu dem Artikel abgeben. In diesem Artikel geht es um Javascript. Ich möchte keinen Sprachvergleich durchführen. Wenn Sie mit Javascript nicht vertraut sind, machen Sie bitte einen Umweg.

Was ist Schließung?
Was ist eine Schließung? Schließung ist eine neue Funktion, die statische Sprachen nicht haben. Aber der Abschluss ist nicht allzu kompliziert, um ihn zu verstehen. Kurz gesagt, der Abschluss ist:

Ein Abschluss ist eine Sammlung lokaler Variablen einer Funktion, aber diese lokalen Variablen bleiben nach der Rückkehr der Funktion weiterhin bestehen.
Schließung bedeutet, dass der „Stapel“ einer Funktion nach der Rückkehr der Funktion nicht freigegeben wird. Wir können auch verstehen, dass diese Funktionsstapel nicht auf dem Stapel, sondern auf dem Heap zugewiesen werden
Beim Definieren einer anderen Funktion innerhalb einer Funktion wird ein Abschluss generiert
Die obige zweite Definition ist die erste ergänzende Erklärung, die das Subjekt, das Prädikat und das Objekt der ersten Definition extrahiert – der Abschluss ist die Menge der „lokalen Variablen“ der Funktion. Es ist lediglich so, dass nach der Rückkehr der Funktion auf diese lokale Variable zugegriffen werden kann. (Dies ist keine offizielle Definition, aber diese Definition sollte für Sie hilfreicher sein, um Schließungen zu verstehen)

Als lokale Variablen kann der Code innerhalb der Funktion auf sie zugreifen. Dies unterscheidet sich nicht von statischen Sprachen. Der Unterschied zu Abschlüssen besteht darin, dass Code außerhalb der Funktion weiterhin auf lokale Variablen zugreifen kann, nachdem die Funktionsausführung beendet ist. Das bedeutet, dass die Funktion eine „Referenz“ zurückgeben muss, die auf den Abschluss verweist, oder diese „Referenz“ einer externen Variablen zuweisen muss, um sicherzustellen, dass externer Code auf die lokalen Variablen im Abschluss zugreifen kann. Natürlich sollte die Entität, die diese Referenz enthält, ein Objekt sein, da in Javascript mit Ausnahme der Grundtypen alles andere ein Objekt ist. Leider stellt ECMAScript keine relevanten Mitglieder und Methoden für den Zugriff auf lokale Variablen in Abschlüssen bereit. Aber in ECMAScript kann die im Funktionsobjekt definierte innere Funktion (innere Funktion) direkt auf die lokalen Variablen der externen Funktion zugreifen. Durch diesen Mechanismus können wir den Zugriff auf den Abschluss auf folgende Weise vervollständigen.

Code kopieren Der Code lautet wie folgt:

Funktionsbegrüßung (Name) {
var text = 'Hallo' name; // lokale Variable
// Bei jedem Aufruf wird ein Abschluss generiert und das interne Funktionsobjekt an den Aufrufer zurückgegeben
Rückgabefunktion() { Alert(text); }
var sayHello=greeting("Closure");
sayHello() // Auf die lokale Variable text
wird durch den Abschluss zugegriffen

Das Ausführungsergebnis des obigen Codes lautet: Hallo Abschluss, da die Funktion sayHello() nach Ausführung der Begrüßungsfunktion weiterhin auf den darin definierten lokalen Variablentext zugreifen kann.

Okay, das ist der legendäre Effekt von Verschlüssen. Es gibt verschiedene Anwendungsszenarien und -modi in Javascript, wie z. B. Singleton, Power Constructor und andere Javascript-Modi, die untrennbar mit der Verwendung von Verschlüssen verbunden sind.

ECMAScript-Abschlussmodell
Wie implementiert ECMAScript Verschlüsse? Wer mehr erfahren möchte, kann sich die ECMAScript-Spezifikation zur Recherche besorgen. Ich gebe hier nur eine einfache Erklärung, auch der Inhalt stammt aus dem Internet.

Wenn die Funktion des ECMAscript-Skripts ausgeführt wird, verfügt jede Funktionszuordnung über eine Ausführungskontextszene (Ausführungskontextszene). Diese Ausführungskontextszene enthält drei Teile

Die Lexikalische Umgebung
Die VariableEnvironment
diese Bindung
Der dritte Punkt, diese Bindung, hat nichts mit Schließungen zu tun und wird in diesem Artikel nicht behandelt. Die Grammatikumgebung wird zum Parsen von Variablenbezeichnern verwendet, die während der Funktionsausführung verwendet werden. Wir können uns die Grammatikumgebung als ein Objekt vorstellen, das zwei wichtige Komponenten enthält: Umgebungsdatensatz (Enviroment Recode) und externe Referenz (Zeiger). Der Umgebungsdatensatz enthält lokale Variablen und Parametervariablen, die innerhalb der Funktion deklariert wurden, und externe Referenzen verweisen auf das Kontextausführungsszenario des externen Funktionsobjekts. Der Wert dieser Referenz in der globalen Kontextszene ist NULL. Eine solche Datenstruktur bildet eine einseitig verknüpfte Liste, wobei jede Referenz auf die äußere Kontextszene verweist.

Zum Beispiel sollte das Abschlussmodell unseres obigen Beispiels so aussehen: Die Funktion sayHello befindet sich auf der unteren Ebene, die obere Ebene ist die Begrüßungsfunktion und die äußerste Ebene ist die globale Szene. Wie unten gezeigt: Wenn sayHello aufgerufen wird, findet sayHello den Wert des lokalen Variablentextes über die Kontextszene, sodass im Dialogfeld auf dem Bildschirm die Funktion der Variablenumgebung (VariableEnvironment) angezeigt wird. und die Grammatikumgebung sind grundsätzlich ähnlich. Einzelheiten zu den spezifischen Unterschieden finden Sie im ECMAScript-Spezifikationsdokument.

Beispielsequenz von Verschlüssen
Zuvor habe ich ungefähr verstanden, was Javascript-Abschlüsse sind und wie Abschlüsse in Javascript implementiert werden. Im Folgenden helfen wir Ihnen, Schließungen anhand einiger Beispiele besser zu verstehen. Die folgenden Beispiele stammen von JavaScript-Verschlüssen für Dummies (Spiegel). Beispiel 1: Lokale Variablen in Abschlüssen sind Referenzen und keine Kopien

Code kopieren Der Code lautet wie folgt:

Funktion say667() {

// Lokale Variable, die innerhalb des Abschlusses landet

var num = 666;

var sayAlert = function() { alarm(num);
num ;

Geben Sie sayAlert;
 zurück
}

var sayAlert = say667();

sayAlert()

Das Ausführungsergebnis sollte also 667 statt 666 sein.

Beispiel 2: Mehrere Funktionen binden denselben Abschluss, da sie in derselben Funktion definiert sind.

Code kopieren Der Code lautet wie folgt:

Funktion setupSomeGlobals() {

// Lokale Variable, die innerhalb des Abschlusses landet

var num = 666;

// Einige Referenzen auf Funktionen als globale Variablen speichern

gAlertNumber = function() { alarm(num);
gIncreaseNumber = function() { num ;
gSetNumber = function(x) { num = x;
}

setupSomeGlobals(); // Werte zu drei globalen Variablen zuweisen

gAlertNumber(); //666

gIncreaseNumber();

gAlertNumber(); // 667

gSetNumber(12);//

gAlertNumber();//12

Beispiel 3: Beim Zuweisen von Funktionen in einer Schleife werden diese Funktionen an denselben Abschluss gebunden

Code kopieren

Der Code lautet wie folgt: Funktion buildList(list) { var result = [];

for (var i = 0; i < list.length; i ) {

Das Ausführungsergebnis von testList besteht darin, dass das undefinierte Fenster item3 dreimal angezeigt wird, da diese drei Funktionen an denselben Abschluss gebunden sind und der Wert von item das zuletzt berechnete Ergebnis ist. Wenn ich jedoch aus der Schleife springe, Der Wert von i ist 4, also list Das Ergebnis von [4] ist undefiniert.

Beispiel 4: Alle lokalen Variablen der äußeren Funktion liegen innerhalb des Abschlusses, auch wenn diese Variable nach der Definition der inneren Funktion deklariert wird.

Code kopieren Der Code lautet wie folgt:

Funktion sayAlice() {

var sayAlert = function() { alarm(alice);
// Lokale Variable, die innerhalb des Abschlusses landet

var alice = 'Hallo Alice';

Geben Sie sayAlert;
 zurück
}

var helloAlice=sayAlice();

halloAlice();

Das Ausführungsergebnis ist ein Popup-Fenster mit der Aufschrift „Hallo Alice“. Auch wenn die lokale Variable nach der Funktion sayAlert deklariert wird, kann weiterhin auf die lokale Variable zugegriffen werden.

Beispiel 5: Erstellen Sie bei jedem Aufruf der Funktion einen neuen Abschluss

Code kopieren Der Code lautet wie folgt:

Funktion newClosure(someNum, someRef) {

// Lokale Variablen, die innerhalb des Abschlusses landen

var num = someNum;

var anArray = [1,2,3];

var ref = someRef;

Rückgabefunktion(x) {

         num = x;

        anArray.push(num);

alarm('num: ' num 

          'nanArray ' anArray.toString() 

          'nref.someVar ' ref.someVar);

}

}

close1=newClosure(40,{someVar:'closure 1'});

close2=newClosure(1000,{someVar:'closure 2'});

Schließung1(5); // num:45 anArray[1,2,3,45] ref:'someVar Schließung1'

Schließung2(-10);// num:990 anArray[1,2,3,990] ref:'someVar Schließung2'

Antrag auf Schließung

Singleton:

Code kopieren Der Code lautet wie folgt:

var singleton = function () {

var privateVariable;

Funktion privateFunction(x) {

           ...privateVariable...

}

Geben Sie {
 zurück
         firstMethod: Funktion (a, b) {

                  ...privateVariable...

},

secondMethod: Funktion (c) {

                  ...privateFunction()...

}

};

}();

Dieser Singleton wird durch Schließungen implementiert. Die Kapselung privater Mitglieder und Methoden wird durch Abschlüsse vervollständigt. Die anonyme Hauptfunktion gibt ein Objekt zurück. Das Objekt enthält zwei Methoden: Methode 1 kann auf private Variablen zugreifen und Methode 2 kann auf interne private Funktionen zugreifen. Was Aufmerksamkeit erfordert, ist das „()“ am Ende der anonymen Hauptfunktion. Ohne dieses „()“ kann der Singleton nicht generiert werden. Denn anonyme Funktionen können nur ein eindeutiges Objekt zurückgeben und nicht von anderen Orten aus aufgerufen werden. So verwenden Sie Verschlüsse, um Singletons zu generieren.

Ausführliche Erklärung von Schließungen in Javascript_Grundkenntnisse