Detaillierte Erläuterung der JavaScript-Closure-Probleme

Closures sind eines der traditionellen Features rein funktionaler Programmiersprachen. Indem Closures als integraler Bestandteil der Kernkonstrukte der Sprache betrachtet werden, zeigt die Sprache JavaScript ihre enge Verwandtschaft zu funktionalen Programmiersprachen. Closures erfreuen sich in gängigen JavaScript-Bibliotheken und in hochrangigem Produktionscode zunehmender Beliebtheit, da sie komplexe Vorgänge vereinfachen können.

1. Variabler Umfang

Bevor wir Closures einführen, wollen wir zunächst den Variablenbereich von JavaScript verstehen. Es gibt zwei Arten von Variablenbereichen: globale Variablen und lokale Variablen.

1. Globale Variablen

var n = 999; //globale Variable Funktion f1() {
        a = 100; //Hier ist a auch eine globale Variable alert(n);
    }
    konsole.log(a); //100

Hier kann der Wert der Variablen direkt innerhalb und außerhalb der Funktion abgerufen werden - globale Variable

2. Lokale Variablen

//lokale Variablen Funktion f2() {
        var b = 22;
    }
    console.log(b); //Fehler

Hier kann der innerhalb der Funktion definierte Wert nicht direkt von außerhalb der Funktion abgerufen werden - lokale Variablen

Was sollten wir an dieser Stelle tun, wenn wir den Wert einer lokalen Variablen von außen abrufen möchten?
Bitte lesen Sie weiter:

2. So erhalten Sie lokale Variablen von außen

Schauen wir uns ein Beispiel an:

var outer = "Äußer"; // Globale Variable var kopieren; 
function outerFn(){ // Globale Funktion var inner = 'Inner'; // Diese Variable hat nur Funktionsumfang und kann nicht von außerhalb aufgerufen werden function innerFn(){ // innerFn() in outerFn() 
 // Hier kann sowohl der globale Kontext als auch der umgebende Kontext verwendet werden.
 // So können Sie auf äußere und innere 
 konsole.log(äußeres); 
 Konsole.log(inner); 
 } 
 copy = innerFn; // Speichere eine Referenz auf innerFn() // Da copy im globalen Kontext deklariert ist, kann es extern verwendet werden} 
äußereFn(); 
copy(); // innerFn() kann nicht direkt aufgerufen werden, sondern über im globalen Bereich deklarierte Variablen.

Lassen Sie uns das obige Beispiel analysieren. Auf die Variable outer kann innerhalb von innerFn() zugegriffen werden, da sie sich im globalen Kontext befindet.

Nachdem outerFn() ausgeführt wurde, wird innerFn() ausgeführt, indem eine Referenz auf die Funktion in eine globale Variable kopiert wird.
Dies wird durch Kopieren erreicht. Wenn die Funktion innerFn() unter Verwendung der Variablen „copy“ aufgerufen wird, liegt sie nicht mehr im Gültigkeitsbereich von outerFn(). Sollte der folgende Code also nicht fehlschlagen?
Konsole.log(inner);
Der Wert der Variable „inner“ sollte undefiniert sein, oder? Die Ausgabe des obigen Codeausschnitts lautet jedoch:
"Äußere"
"Innere"

Dies ist die Kettenbereichsstruktur von JavaScript. Das untergeordnete Objekt sucht jeweils eine Ebene höher nach den Variablen aller übergeordneten Objekte. Daher sind alle Variablen des übergeordneten Objekts für das untergeordnete Objekt sichtbar, aber nicht umgekehrt.

Auf diese Weise können wir die lokalen Variablen innerhalb der Funktion erhalten.

3. Das Konzept der Schließung

Die copy()-Funktion im obigen Codeblock ist ein Abschluss. Meines Erachtens ist eine Closure eine Funktion, die die Variablen innerhalb der Funktion lesen kann.
In JavaScript können lokale Variablen durch Unterfunktionen innerhalb einer Funktion abgerufen werden. Daher können Closures als innerhalb von Funktionen definierte Funktionen verstanden werden.
Es kann als Brücke verstanden werden, die das Innere und Äußere einer Funktion verbindet.

4. Die Rolle des Abschlusses

Meiner Meinung nach spiegelt sich die Rolle von Verschlüssen hauptsächlich in zwei Aspekten wider:

1. Sie können Variablen innerhalb der Funktion lesen

Dieser Effekt wurde im vorherigen Codeblock deutlich demonstriert.

2. Der Wert lokaler Variablen kann im Speicher gehalten werden

Wie wir alle wissen, belegen lokale Variablen nur dann temporären Speicherplatz im Speicher, wenn sie verwendet werden, und der Speicherplatz wird nach Beendigung der Funktion automatisch freigegeben. Durch das Aufkommen von Closures können lokale Variablen genauso konsistent im Speicher gespeichert werden wie globale Variablen.

        Funktion c1() {
            var z = 9999;
            nAdd = Funktion() {
                z += 1;
            }

            Funktion c2() {
                console.log(z);
            }
            Rückgabe c2;
        }
        var Ergebnis = c1();
        Ergebnis(); //9999
        nAdd();
        Ergebnis(); //10000

Im obigen Code wird c1() einmal ausgeführt, wobei z=9999 ist; nAdd() wird noch einmal ausgeführt, um z+1 zu machen; und c1() wird noch einmal ausgeführt, um den Wert von z zu diesem Zeitpunkt, z=10000, auszugeben. Dies bedeutet, dass der Wert von z immer im Speicher gespeichert bleibt und nicht nach dem ersten Aufruf von c1() automatisch gelöscht wird.

An dieser Stelle sollten Sie darauf achten, dass die Verwendung von Closures viel Speicher verbraucht. Missbrauchen Sie Closures daher nicht. Löschen Sie vor dem Verlassen der Funktion alle nicht verwendeten lokalen Variablen.

Dies ist das Ende dieses Artikels mit der ausführlichen Erläuterung von JavaScript-Closure-Problemen. Weitere relevante JavaScript-Closure-Probleme finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!