JavaScript-Closures erklärt
1. Was ist ein Abschluss?Eine Kombination aus der Funktion selbst und dem Zustand der Umgebung, in der die Funktion deklariert wird.
1.2 Memoisierung von Closures: Funktionen merken sich die Umgebung, in der sie definiert wurden
1.3 Closure-Phänomen: Jedes Mal, wenn in JS eine Funktion erstellt wird, wird ein Closure erstellt
2. Funktionen von Closures: Auswendiglernen, Simulation privater Variablen2.1 Speicher
Beispiel:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta http-equiv="X-UA-kompatibel" content="IE=edge">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>Dokument</title>
</Kopf>
<Text>
<Skript>
Funktion erstelleCheckTemp(standardTemp){
Funktion checkTemp(n){
wenn(n<=standardTemp){
alert('Ihre Temperatur ist normal');
}anders{
alert('Ihre Körpertemperatur ist hoch');
}
}
gib checkTemp zurück;
}
var checkTemp_A = createCheckTemp(37.1);
var checkTemp_B = createCheckTemp(37.3);
checkTemp_A(37.2);
checkTemp_A(37.0);
checkTemp_B(37.2);
checkTemp_B(37.0);
</Skript>
</body>
</html>Detail: 1: Erinnerung an Schließungen 2: Die Funktion return checkTemp ist ein Funktionsname 3: Definieren Sie var checkTemp_A und checkTemp_A, um den Funktionsnamen checkTemp zu erhalten, anstatt ihn direkt aufzurufen 2.2 Simulation privater Variablen (sichere Variablen)
Beispiel für einen Closure-Code:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta http-equiv="X-UA-kompatibel" content="IE=edge">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>Dokument</title>
</Kopf>
<Text>
<Skript>
// Kapsele eine Funktion ein, die Funktion dieser Funktion besteht darin, die Variable function fun(){ zu privatisieren.
//Definiere eine lokale Variable a
var a = 0;
zurückkehren {
getA:Funktion(){
gib a zurück;
},
hinzufügen:Funktion(){
eine ++;
},
pow:Funktion(){
ein*=2;
}
}
}
var obj = spaß();
// Wenn Sie die Variable a außerhalb der Fun-Funktion verwenden möchten, besteht die einzige Möglichkeit darin, die Methode getA() aufzurufen console.log(obj.getA());
//Möchte 1 zur Variable a hinzufügen obj.add();
obj.add();
obj.add();
console.log(obj.getA());
obj.pow();
console.log(obj.getA());
</Skript>
</body>
</html>
Tatsächlich ist es verständlich, dass JavaScript Funktionstypen wie C++ und Java, wie etwa int sum(), int add(), int pow() usw., nicht definieren kann. Daher ist es notwendig, die Eigenschaften von Closures zu nutzen: das heißt, den Speicher des Closure innerhalb der Funktion zu verwenden, um mit den Variablen innerhalb der Funktion zu arbeiten, und dann den Namen der Closure-Funktion zurückzugeben, um interne Datenoperationen auszuführen. 3.IIFE (Sofort aufgerufener Funktionsausdruck):Sobald eine JS-Sonderfunktion definiert ist, wird sie sofort aufgerufen
3.1 IIFE-Rolle 1 – Zuweisen von Werten zu VariablenBeispiel: Vergleichen Sie die Vorher- und Nachher-Bilder, um den Programmierstand widerzuspiegeln. . . Vereinfachen Sie den Code. . Schön. . .
3.2 IIFE-Funktion 2 – Konvertieren globaler Variablen in lokale Variablen
In diesem Fall sind die Ergebnisse der folgenden fünf Anweisungen alle 5, da es in JS kein Konzept des Blockbereichs gibt (das ist das aktuelle Verständnis), sodass var i zu einer globalen Variable wird und i=5 nach der for-Schleife. Das Ergebnis aller fünf Aussagen ist also 5. Dann können wir zur Lösung dieses Problems IIFE verwenden, das im Wesentlichen die Abschlussfunktion der Funktion nutzt.
Durch Übergeben der globalen Variable i an die IIFE-Funktion wird die globale Variable zu einer lokalen Variable. Durch Verwendung der Closure-Funktion der JS-Funktion kann die Funktion von arr[2]() in der Abbildung implementiert werden. ZusammenfassenDieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalten auf 123WORDPRESS.COM mehr Aufmerksamkeit schenken können! Das könnte Sie auch interessieren:
|
<<: CSS fixiert das Tag auf Containerebene (div...) an einer Position (ganz rechts auf der Seite)
>>: Einführung in den CSS BEM-Benennungsstandard (empfohlen)
Artikel empfehlen
Beispielcode für ungewöhnliche HTML-Tags „optgroup“, „sub“, „sup“ und „bdo“
Optgroup wird im Auswahltag verwendet, um den Inha...
Installations-Tutorial zur dekomprimierten Version von MySQL 5.7.23 für WinX64
Detailliertes Installations-Tutorial zur Dekompri...
Detaillierte Erklärung gängiger Befehle in MySQL 8.0+
Aktivieren Sie den Fernzugriff Aktivieren Sie die...
Der Effekt eines dynamischen CSS-Farbverlaufsrahmens, der um den Inhaltsbereich rotiert (Beispielcode)
Rendern Nachdem ich online nach relevanten Inform...
Einführung in die MySQL-Ansicht und Tutorial zur grundlegenden Bedienung
Vorwort Ansicht ist ein sehr nützliches Datenbank...
JavaScript-Programmierung durch Lernen der Positionierung des Schwerpunktalgorithmus in Matlab
Inhaltsverzeichnis Matlab-Centroid-Algorithmus Da...
Tutorial-Diagramm zur kostenlosen 64-Bit-Installationsversion von MySQL 5.7.31
1. Herunterladen Download-Adresse: https://dev.my...
Vue importiert Echarts, um ein Linienstreudiagramm zu realisieren
In diesem Artikel wird der spezifische Code für d...
Docker-Bereitstellung - Nginx-Implementierungsprozess - Grafik und Text - detaillierte Erläuterung
1. Laden Sie nginx herunter [root@localhost my.Sh...
js implementiert eine einfache dreistufige Auswahlkaskade für Provinzen, Gemeinden und Bezirke
In diesem Artikel wird der spezifische Code von j...
Lösen Sie das Problem beim Laden der Vektorkartenquelle in OpenLayers 3
1. Vektorkarte Vektorgrafiken verwenden gerade Li...
Beispiel für die Verwendung von MRG_MyISAM (MERGE) zur Implementierung einer Abfrage nach der Partitionierung in MySQL
Die Optimierung großer Datenbankdatenmengen ist e...
Verwenden Sie CSS, um einen 3D-Fotowandeffekt zu erstellen
Verwenden Sie CSS, um eine 3D-Fotowand zu erstell...
Konfiguration und Lizenzaktivierung der Remotedesktopdienste von Windows Server 2016 (2 Benutzer)
Die Standardanzahl von Remotedesktopverbindungen ...
Detaillierte Analyse der MySQL Master-Slave-Replikation
Vorwort: In MySQL sollte die Master-Slave-Archite...