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
Detaillierte Erklärung der Unterschiede zwischen SQL Joint Query Inner Join, Outer Join und Cross Join
Beim Entwickeln von Anwendungen, die eine Datenba...
URL-Rewrite-Modul 2.1 URL-Rewrite-Modul – Regeln schreiben
Inhaltsverzeichnis Voraussetzungen Einrichten ein...
Aufrufen und Ausführen von Host-Docker-Operationen im Docker-Container
Zunächst einmal ist dieser Beitrag Docker-Neuling...
Verstehen von MySQL-Deadlock-Routinen durch eindeutige Index-S-Sperre und X-Sperre
In „MySQL-Deadlock-Probleme anhand des Quellcodes...
Lösung für das Problem, dass VMware Workstation Pro aufgrund eines Win10-Updates nicht geöffnet werden kann
Als ich heute Abend nach dem Abendessen meinen La...
Detaillierte Erläuterung der gespeicherten Prozeduren, Cursor und Transaktionsbeispiele von MySQL
Detaillierte Erläuterung der gespeicherten Prozed...
So verwenden Sie den SS-Befehl anstelle von Netstat im Linux-Betrieb und bei der Wartung
Vorwort Beim Betrieb und der Verwaltung von Linux...
Eine detaillierte Erklärung der überlappenden und weichen Farbanpassungsmethode bei der Farbanpassung von Webseiten
In diesem Artikel gibt es keine Spitzfindigkeiten,...
7 Fähigkeiten, die Webdesigner haben müssen
Webdesign ist sowohl eine Wissenschaft als auch e...
mysql installer web community 5.7.21.0.msi grafik-tutorial zur installation
In diesem Artikelbeispiel wird der spezifische Co...
So wird eine Select-Anweisung in MySQL ausgeführt
Inhaltsverzeichnis 1. MySQL aus einer Makroperspe...
Was wir von Googles neuer Benutzeroberfläche (Bilder und Text) lernen können
Die bedeutendste Website-Änderung im Jahr 2011 bet...
So aktualisieren, verpacken und laden Sie Docker-Container in die Alibaba Cloud hoch
Dieses Mal werden wir versuchen, den laufenden Co...
Der Unterschied zwischen HTML, XHTML und XML
Entwicklungstrends: html (Hypertext-Markup-Sprache...
Vue implementiert die vollständige Auswahlfunktion
In diesem Artikelbeispiel wird der spezifische Co...