Was sind Umfang und Schließung in JavaScript??

Was sind Umfang und Schließung in JavaScript??
Wenn Sie mit JavaScript zum ersten Mal beginnen, sind Sie möglicherweise auf Umfang und Schließungen gestoßen. Dies sind sehr wichtige Konzepte für einen Anfänger. Auch in Interviews fragt der Interviewer nach Schließungen.Heute werden wir diskutieren, was Umfang ist und was die grundlegenden Konzepte des Umfangs in JavaScript sind. Nachdem wir den Umfang besprochen haben, werden wir uns auf die Schließung einlassen und das besprechen. Am Ende dieses Artikels werden Sie in JavaScript Kenntnis von Scopes und Verschluss haben.

Vor dem Start würde ich vorschlagen, dass Sie nicht direkt zum Schließen springen, ohne den Umfang zu verstehen. Der Grund dafür ist, dass für das Schließkonzept das Verständnis des Umfangskonzepts sehr wichtig ist.

Umfang

Die Variablen, auf die Sie zugreifen können, ist der Umfang dieser Variablen und ist in zwei Teile unterteilt:

Globaler Umfang

Wenn eine Variable während des gesamten Programms zugänglich ist, verfügt sie über einen globalen Umfang. Mit anderen Worten, wir können sagen, dass eine Variable außerhalb aller Funktionen und lockigen Zahnspangen ist, ist sie eine globale Variable und hat einen globalen Umfang.

Ein Beispiel für den globalen Umfang in JavaScript ist:

const GlobalName = "John Cena";

Nachdem wir die Variable mit dem Namen GlobalName deklariert haben, können wir ihren Wert überall im Code einschließlich Funktionen/Methoden erhalten.

Zum Beispiel:

//Globale Variable
const GlobalName = "John Cena";
// Funktion mit dem Namen Greet fungieren
Funktion Greet ()
Konsole.log ("Hallo", globalName);

// die Funktion aufrufen
grüßen();
// Zugriff auf die globale Variable wieder außerhalb der Funktion
Konsole.log ("Hallo noch einmal", globalName);

In diesem Beispiel haben wir zuerst eine Variable mit dem Namen von initiiert GlobalName. Danach konstruierten wir eine Funktion, bei der wir den globalen Namen begrüßten. Dann haben wir die Funktion mit dieser Anweisung angerufen grüßen(). Danach wir Konsole.Protokoll Die GlobalName Variable, um festzustellen, ob es außerhalb der Funktion zugänglich ist oder nicht. Der in der Konsole gezeigte Ausgang lautet:

Es sollte jedoch beachtet werden, dass die meisten Programmierer weltweit keine Variable deklarieren, da ein Risiko von doppelten Variablennamen besteht. Doppelte Variablennamen treten auf, wenn zwei Variablen denselben Namen haben. In den meisten Fällen führt dies zu einem Fehler, der schwer zu debuggen kann.

Lokaler Bereich

Wie der Name schon sagt, hat eine lokale Variable einen lokalen Bereich. Das bedeutet, dass es nur innerhalb einer Funktion/Methode oder eines Codeblocks zugänglich ist. Außerhalb dieses Gebiets ist es nicht zugänglich und JavaScript erzeugt einen Fehler. Lokaler Bereich in JavaScript ist in zwei Arten unterteilt.

Funktionsumfang

Wenn eine Variable innerhalb einer Funktion deklariert wird, ist sie nur innerhalb dieser Funktion zugänglich und ist außerhalb davon nicht zugänglich.

Zum Beispiel:

// Funktion mit dem Namen Greet fungieren
Funktion Greet ()
//lokale Variable
const localname = "Randy Orton";
Konsole.log ("Hallo", Lokalname);

// die Funktion aufrufen
grüßen();
// Zugriff auf lokale Variable erneut außerhalb der Funktion
// Dies erzeugt einen Fehler
Konsole.log ("Hallo noch einmal", Lokalname);

In diesem Beispiel haben wir einen variablen Lokalnamen und dann eine Konsole eingeleitet.Protokollieren Sie es. Dies zeigt uns die Ausgabe von "Randy Orton" im Konsolenprotokoll. Wenn wir jedoch trösten.Protokollieren Sie die lokale Variable in der letzten Zeile, sie generiert einen Fehler.

Ausgang:

Blockbereich

Block Scope sagt uns, dass diese lockigen Klammern, wenn wir eine Variable in lockigen Klammern deklarieren. Das wird als Blockbereich bezeichnet. Außerhalb der lockigen Klammern kann man nicht auf die Block -Umfangsvariable zugreifen.

Zum Beispiel:


const name = "rey mysterio";
Konsole.log ("Hallo", Name);

In diesem Beispiel haben wir eine Variable mit dem Blockbereich deklariert, da sie sich in der lockigen Klammer befindet. Wir trösten danach protokollieren.

Die Ausgabe von "Hallo Rey Mysterio" wird im Konsolenprotokoll gesehen. Wenn wir es jedoch außerhalb der Klammern konsole, wird ein Fehler erzeugt.

Greift die Funktion auf einen anderen Funktionsbereich zu?

Da wir bereits Funktionsumfang erörtert haben, lassen Sie uns etwas Licht in die Frage geben, ob zwei Funktionen einen Umfang teilen oder nicht. Die Antwort lautet Nein, wenn wir eine Variable in einer Funktion deklarieren und versuchen, in einer anderen Funktion darauf zuzugreifen.

Zum Beispiel:

Funktion firstMessage ()
const message = "Ich bin die erste Funktion";
Konsole.log ("Zugriff von der ersten Funktion:", Nachricht);

Funktion SecondMessage ()
Erste Nachricht();
Konsole.log ("Zugriff auf die zweite Funktion", Nachricht);

SecondMessage ();

In diesem Beispiel haben wir eine Funktion mit dem Namen FirstMessage konstruiert und eine Variable deklariert, woraufhin wir trösten.Protokollieren Sie es. Danach haben wir eine zweite Variable erstellt und die FirstMessage () -Funktion bezeichnet. Es wird gut laufen und wir werden die Nachricht für die Konsole von der FirstMessage () -Funktion sehen können. Wenn wir jedoch versuchen, auf die Funktion der variablen Nachricht aus der Funktion FirstMessage () in der Funktion von SecondMessage () zugreifen zu können, sehen wir einen Fehler.

Dieser Fehler wird durch Schließungen gelöst.

Was ist Verschluss in JavaScript??

Wenn Sie jemals eine Funktion innerhalb einer anderen Funktion erstellt haben, haben Sie im Grunde genommen einen Verschluss erstellt. Die Innenfunktion wird als Verschluss bezeichnet und eine technische Definition wäre, dass eine Funktion mit Zugriff auf den Umfang der Elternfunktion, auch wenn die übergeordnete Funktion geschlossen wurde, als Verschluss bezeichnet wird.

Lassen Sie uns ein Beispiel für eine Schließung diskutieren:

Funktion parentfunc ()
lass nameneparent = "Eltern";
Konsole.log (nameneparent);
Funktion Childfunc ()
Konsole.log ("Child and", Neameparent);

kehrt Childfunc zurück;

const store = parentfunc ();
Konsole.Protokoll (Speicher);
speichern();

In diesem Beispiel haben wir a konstruiert Elternfunc und initiierte eine Variable Typenprogramm. Danach trösten wir.Protokollieren Sie den Typenrecht und konstruierte eine zweite Funktion innerhalb der übergeordneten Funktion i-e childfunc. In dieser untergeordneten Funktion trösten wir eine Zeichenfolge „Kind und“ mit der genannten Variablen ab. Wir können sehen, dass Parentfunc die zurückgibt Childfunc. Wenn wir nun das ParentFunc Console -Protokoll anrufen. Der Childfunc War nicht angerufen und trat nicht in Aktion ein. Die Außen- und Innenfunktion wird jedoch im variablen Speicher gespeichert. Wenn wir den Laden protokollieren, werden wir beide Funktionen sehen. Wenn wir das anrufen speichern(), Wir rufen in der Tat die Innenfunktion oder die anonyme Funktion, die in der Parentfunc () Chidfunc ist, auf. Jetzt werden wir die innere Funktionskonsole sehen.Protokoll I-e "Kind und Eltern",

Durch die von uns erstellte Schließung können wir auch den Umfang des Elternteils verwenden.

Abschluss

In diesem Artikel haben wir die Konzepte des Umfangs und des Verschlusses und des Umfangs erörtert. Wir haben die beiden Haupttypen von Umfang erörtert: Globaler Bereich und lokaler Umfang. Weiter im lokalen Bereich haben wir zusammen mit Beispielen funktionelle Umfangs- und Blockbereiche erörtert. Danach sind wir auf ein Problem gestoßen, das Zugriff auf einen anderen Funktionsbereich hat. Wir haben dies mithilfe der Diskussion von Schließungen zusammen mit Beispielen gelöst.