Erfahren Sie in einem Artikel mehr über JavaScript-Closure-Funktionen

Erfahren Sie in einem Artikel mehr über JavaScript-Closure-Funktionen

Variablenbereich

Um JavaScript-Closures zu verstehen, müssen Sie zunächst den Gültigkeitsbereich von JavaScript-Variablen verstehen.

Es gibt zwei Arten von Variablenbereichen: global und lokal (globale Variablen und lokale Variablen)

In JavaScript können globale Variablen direkt innerhalb einer Funktion gelesen werden.

var n=10
Funktion fn(){
	Alarm(e)
}
fn() //10

Die Variablen innerhalb einer Funktion können nicht von außerhalb der Funktion gelesen werden.

Funktion fn(){
	var n=10;
}
fn()
alert(n) //n ist nicht definiert Die Funktion kann n nicht von außerhalb der Funktion lesen

Hinweis: Wenn var verwendet wird, um eine Variable innerhalb einer Funktion zu deklarieren, ist die Variable eine lokale Variable. Wenn var nicht verwendet wird, ist die Variable eine globale Variable.

Zum Beispiel:

Funktion fn(){
	n = 10;
}
fn()
Alarm(e) //10

Darüber hinaus sind auch die Funktionsparameter lokal und funktionieren nur innerhalb der Funktion.

Normalerweise können wir die lokalen Variablen nicht innerhalb einer Funktion abrufen. Die einzige Problemumgehung besteht darin, innerhalb der Funktion eine weitere Funktion zu deklarieren.

Funktion f1(){
	var n=10;
	Funktion f2(){
		Alarm(e)
	}
}

Die Funktion f2 kann alle lokalen Variablen innerhalb der Funktion f1 abrufen, die Funktion f1 kann jedoch nicht die lokalen Variablen innerhalb der Funktion f2 abrufen – die „Kettenbereichs“-Struktur ist einzigartig in der Sprache JavaScript. (Das heißt, das untergeordnete Objekt sucht Ebene für Ebene nach den Variablen aller übergeordneten Objekte.) Alle Variablen des übergeordneten Objekts sind daher für das untergeordnete Objekt sichtbar.

Die Funktion f2 kann die lokalen Variablen der übergeordneten Funktion f1 abrufen. Wenn die Funktion f2() zurückgegeben wird, kann von außerhalb der Funktion f1 auf die Variablen innerhalb der Funktion f1() zugegriffen werden.

Zum Beispiel:

Funktion f1(){
	var n=10;
	Funktion f2(){
		Alarm(e)
	}
	return f2()
}
f1() //Seiten-Popup 10

Die Funktion f2() im Beispiel ist eine Abschlussfunktion.

Das Konzept der Schließung

Aus Gültigkeitsgründen können wir von außerhalb einer Funktion nicht auf die in dieser Funktion definierten Variablen zugreifen. Manchmal ist dies jedoch erforderlich, sodass das Konzept der Schließung auftaucht.

Ein Abschluss ist eine Funktion, die Zugriff auf Variablen im Gültigkeitsbereich einer anderen Funktion hat.

Im obigen Beispiel ist die innere Funktion f2 eine Abschlussfunktion.

Im Wesentlichen ist ein Abschluss eine Brücke, die das Innere einer Funktion mit dem Äußeren der Funktion verbindet.

Closure ist ein Mechanismus zum Schutz privater Variablen. Es bildet einen privaten Bereich, wenn eine Funktion ausgeführt wird, und schützt die darin enthaltenen privaten Variablen vor externen Eingriffen.

Verwendung von Verschlüssen

(1) Sie können Variablen innerhalb der übergeordneten Funktion lesen.

(2) Der Wert der Variablen bleibt immer im Speicher erhalten (wodurch die lokale Variable zu einer globalen Variable wird) und wird durch den Garbage Collection-Mechanismus nicht gelöscht.

Nachteile von Verschlüssen

Da Closures alle Variablen in der Funktion im Speicher speichern und der Garbage Collection-Mechanismus sie nicht bereinigt, ist der Speicherverbrauch sehr groß. Daher sollten Closures nicht missbraucht werden, da sonst Speicherlecks auftreten können.

Auffüllen:

Was ist ein Speicherleck?

Programme benötigen Speicher, um ausgeführt zu werden. Immer wenn Speicher angefordert wird, muss das Betriebssystem diesen bereitstellen.
Wenn einige Codevariablen in der Anwendung keinen Speicher mehr benötigen, aber vom Betriebssystem oder dem verfügbaren Speicherpool nicht zurückgefordert werden, bedeutet dies, dass ein Speicherverlust aufgetreten ist.

Das heißt, wenn ein Teil des Speichers nicht mehr benötigt wird, existiert er immer noch - Speicherleck

Lösen Sie das Problem des durch die Schließung verursachten Speicherverlusts:

Löschen Sie vor dem Verlassen der Funktion alle nicht verwendeten lokalen Variablen.

Wenn Sie beispielsweise den Wert der aktuellen Variablen auf „null“ setzen, werden diese Variablen mit dem Wert „null“ beim Starten des Garbage Collection-Mechanismus automatisch wiederverwendet.

Lassen Sie uns abschließend die Vor- und Nachteile von Closures zusammenfassen.

Nutzen

① Schützen Sie die Sicherheit von Variablen innerhalb der Funktion, implementieren Sie eine Kapselung und verhindern Sie, dass Variablen in andere Umgebungen fließen und Namenskonflikte verursachen

② Behalten Sie eine Variable im Speicher für die Zwischenspeicherung bei (übermäßiger Gebrauch ist jedoch auch ein Nachteil, da er Speicher verbraucht).

③Anonyme selbstausführende Funktionen können den Speicherverbrauch reduzieren

Schaden

① Einer der Punkte wurde oben bereits berücksichtigt, nämlich, dass die referenzierten privaten Variablen nicht zerstört werden können, was den Speicherverbrauch erhöht und Speicherlecks verursacht. Die Lösung besteht darin, sie nach Verwendung der Variablen manuell auf Null zuzuweisen.

② Zweitens führt Closures zu Leistungsverlusten, da sie domänenübergreifenden Zugriff beinhalten. Wir können die Auswirkungen auf die Ausführungsgeschwindigkeit verringern, indem wir bereichsübergreifende Variablen in lokalen Variablen speichern und dann direkt auf lokale Variablen zugreifen.

Zusammenfassen

Dies ist das Ende dieses Artikels über JavaScript-Closure-Funktionen. Weitere relevante Inhalte zu JavaScript-Closure-Funktionen 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!

Das könnte Sie auch interessieren:
  • JavaScript-Closures erklärt
  • Javascript-Bereich und Abschlussdetails
  • Detaillierte Erläuterung der JavaScript-Closure-Probleme
  • 9 Anwendungsszenarien für JS-Closures
  • Anwendungsfälle für JavaScript-Closures
  • Erweiterte Closures in JavaScript erklärt

<<:  Tomcat-Quellcodeanalyse und -Verarbeitung

>>:  Webdesign-Tutorial (7): Verbesserung der Webdesign-Effizienz

Artikel empfehlen

Tutorial zur Installation und Konfiguration von MySQL 5.7

In diesem Artikel finden Sie das Tutorial zur Ins...

Grundlegendes Verständnis und Verwendung der HTML-Auswahloption

Detaillierte Erklärung von HTML (Option auswählen)...

js, um den Popup-Effekt zu erzielen

In diesem Artikelbeispiel wird der spezifische Co...

So schreiben Sie speichereffiziente Anwendungen mit Node.js

Inhaltsverzeichnis Vorwort Problem: Kopieren groß...

So legen Sie eine Verzeichnis-Whitelist und eine IP-Whitelist in Nginx fest

1. Legen Sie eine Verzeichnis-Whitelist fest: Leg...

JavaScript-Implementierung der Dropdown-Liste

In diesem Artikelbeispiel wird der spezifische Ja...

Detaillierte Erklärung von JavaScript zur Überwachung von Routenänderungen

Inhaltsverzeichnis Geschichte pushState() Methode...

Implementierung der Installation von Docker in einer Win10-Umgebung

1. Rufen Sie die offizielle Docker-Website auf Ge...

Drei Eigenschaften von Javascript-Objekten

Inhaltsverzeichnis 1. beschreibbar: beschreibbar ...