JavaScript -Schließungen
JavaScript-Variablen können zum lokalen oder globalen Geltungsbereich gehören.
Globale Variablen können mit Closures lokal (privat) gemacht werden .
Globale Variablen
A kann wie folgt auf alle innerhalb der Funktion functiondefinierten Variablen zugreifen :
Beispiel
function myFunction() {
let a = 4;
return a * a;
}
Aber a functionkann auch auf Variablen zugreifen, die außerhalb der Funktion definiert sind, wie folgt:
Beispiel
let a = 4;
function myFunction() {
return a * a;
}
Im letzten Beispiel ist a eine globale Variable.
Auf einer Webseite gehören globale Variablen zum Fensterobjekt.
Globale Variablen können von allen Skripten auf der Seite (und im Fenster) verwendet (und geändert) werden.
Im ersten Beispiel ist a eine lokale Variable.
Eine lokale Variable kann nur innerhalb der Funktion verwendet werden, in der sie definiert ist. Es ist vor anderen Funktionen und anderem Skriptcode verborgen.
Globale und lokale Variablen mit demselben Namen sind unterschiedliche Variablen. Das Ändern des einen ändert nicht das andere.
Variablen, die ohne Deklarationsschlüsselwort ( var,
let, oder const) erstellt werden, sind immer global, auch wenn sie innerhalb einer Funktion erstellt werden.
Beispiel
function myFunction() {
a = 4;
}
Variable Lebensdauer
Globale Variablen leben, bis die Seite verworfen wird, z. B. wenn Sie zu einer anderen Seite navigieren oder das Fenster schließen.
Lokale Variablen haben eine kurze Lebensdauer. Sie werden erstellt, wenn die Funktion aufgerufen wird, und gelöscht, wenn die Funktion beendet ist.
Ein Gegendilemma
Angenommen, Sie möchten eine Variable zum Zählen von etwas verwenden, und Sie möchten, dass dieser Zähler für alle Funktionen verfügbar ist.
Sie könnten eine globale Variable und a verwenden function, um den Zähler zu erhöhen:
Beispiel
// Initiate counter
let counter = 0;
// Function to increment
counter
function add() {
counter += 1;
}
// Call add() 3 times
add();
add();
add();
// The counter should now be 3
Es gibt ein Problem mit der obigen Lösung: Jeder Code auf der Seite kann den Zähler ändern, ohne add() aufzurufen.
Der Zähler sollte für die add()Funktion lokal sein, um zu verhindern, dass anderer Code ihn ändert:
Beispiel
// Initiate counter
let counter = 0;
// Function to increment
counter
function add() {
let counter = 0;
counter += 1;
}
//
Call add() 3 times
add();
add();
add();
//The counter should
now be 3. But it is 0
Es hat nicht funktioniert, weil wir den globalen Zähler anstelle des lokalen Zählers anzeigen.
Wir können den globalen Zähler entfernen und auf den lokalen Zähler zugreifen, indem wir ihn von der Funktion zurückgeben lassen:
Beispiel
// Function to increment
counter
function add() {
let counter = 0;
counter += 1;
return counter;
}
//
Call add() 3 times
add();
add();
add();
//The counter should
now be 3. But it is 1.
Es hat nicht funktioniert, weil wir den lokalen Zähler jedes Mal zurückgesetzt haben, wenn wir die Funktion aufrufen.
Eine innere JavaScript-Funktion kann dies lösen.
Verschachtelte JavaScript-Funktionen
Alle Funktionen haben Zugriff auf den globalen Geltungsbereich.
Tatsächlich haben in JavaScript alle Funktionen Zugriff auf den Geltungsbereich "über" ihnen.
JavaScript unterstützt verschachtelte Funktionen. Verschachtelte Funktionen haben Zugriff auf den Geltungsbereich "über" ihnen.
In diesem Beispiel hat die innere Funktion plus()Zugriff auf die counterVariable in der übergeordneten Funktion:
Beispiel
function add() {
let counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}
Dies hätte das Gegendilemma lösen können, wenn wir die plus()
Funktion von außen erreichen könnten.
Wir müssen auch einen Weg finden, counter = 0nur einmal auszuführen.
Wir brauchen eine Schließung.
JavaScript-Schließungen
Erinnern Sie sich an selbstaufrufende Funktionen? Was macht diese Funktion?
Beispiel
const add = (function () {
let counter = 0;
return function () {counter += 1; return counter}
})();
add();
add();
add();
// the counter is now 3
Beispiel erklärt
Die Variable addwird dem Rückgabewert einer selbstaufrufenden Funktion zugewiesen.
Die selbstaufrufende Funktion wird nur einmal ausgeführt. Es setzt den Zähler auf Null (0) und gibt einen Funktionsausdruck zurück.
Auf diese Weise wird add zu einer Funktion. Das "Wunderbare" daran ist, dass es auf den Zähler im übergeordneten Bereich zugreifen kann.
Dies wird als JavaScript- Closure bezeichnet. Es ermöglicht einer Funktion, " private " Variablen zu haben.
Der Zähler ist durch den Geltungsbereich der anonymen Funktion geschützt und kann nur mit der add-Funktion geändert werden.
Eine Schließung ist eine Funktion, die Zugriff auf den übergeordneten Gültigkeitsbereich hat, selbst nachdem die übergeordnete Funktion geschlossen wurde.