JavaScript -Funktionsschließungen | Erklärt
Das Konzept der Schließungen gibt es schon seit einiger Zeit, aber die Menschen haben Schwierigkeiten, es zu verstehen. Wir werden Schritt für Schritt übergehen und es mit Hilfe von Beispielen wirklich leicht verstehen.
Was sind Schließungen in JavaScript?
Sehr kurz ist der Abschluss Zugang zum äußeren Bereich aus dem inneren Bereich bei der Arbeit mit verschachtelten Funktionen. Jedes Mal, wenn eine verschachtelte Funktion in JavaScript ausgeführt wird, wird eine Schließung erstellt. Die in der Funktion definierten Variablen werden bei der Funktionsausführung erstellt und aus dem Speicher nach der vollständigen Ausführung der jeweiligen Funktion entfernt.
Um das Konzept der Schließungen in JavaScript zu verstehen, müssen wir den Unterschied zwischen dem globalen und dem lokalen Umfang kennen. Nun, wir werden diese kurz kurz durchgehen.
Variablenbereiche
Wie oben erwähnt, gibt es in JavaScript zwei wichtige variable Bereiche:
- Globaler Umfang
- Lokaler Bereich
Die außerhalb einer Funktion definierten Variablen werden als bezeichnet als globale Variablen und haben a globaler Umfang. Diese Variablen können von überall innerhalb des Programms zugegriffen werden. Deshalb verwenden wir den Begriff „global“.
Vergleichsweise sind die in einer Funktion definierten Variablen als bekannt als Lokale Variablen und ist bekannt, dass eine Lokaler Bereich. Der lokale Umfang ist weiter in Funktionsumfang und Blockumfang unterteilt, aber das ist für uns kein Hauptanliegen. Lokale Variablen kann nur aus der Funktion, in der sie deklariert werden, zugegriffen werden
Nehmen Sie diesen Codeblock, um den Umfang zu verstehen:
var sitename = "linuxHint!";Funktion printSiteName ()
Lassen Sie topicname = "JavaScript";
Konsole.log (sitename);
printSiteName ();
Konsole.log (topicname);
Was wir im obigen Code tun, ist, dass wir eine globale Variable erstellen SiteName und wir drucken es in einer Funktion namens namens printSiteName (), Diese Funktion enthält eine lokale Variable Themenname Und wir versuchen, den Wert dieser Variablen außerhalb dieser Funktion auszudrucken. Hier, SiteName ist eine globale Variable und Themenname ist eine lokale Variable. Die Ausgabe des folgenden Codes lautet wie:
Wie Sie deutlich sehen können, konnten wir auf die zugreifen SiteName Variablen innerhalb einer Funktion, aber wir konnten nicht auf die lokale Variable zugreifen Themenname außerhalb seiner Funktion. Sie können weitere Details zu diesen verschiedenen Variablen und diesem Umfang erfahren.
Wie funktioniert eine Schließung in JavaScript?
Nachdem wir wissen, wie Scoping in JavaScript funktioniert, können wir die Arbeit von Schließungen leicht verstehen.
Schließungen sind Funktionen, die so ineinander verschachtelt sind, dass die innere Funktion für die äußere Funktion lokal geschrieben wird, und die äußere Funktion wird weltweit für die innere Funktion abgebildet. Was bedeutet, dass die innere Funktion Zugriff auf die Attribute der äußeren Funktion hat.
Nehmen Sie den folgenden Code für ein besseres Verständnis:
Funktion oterfunction ()lass outvar = "Ich bin äußerlich";
Funktion Innerfunction ()
lass invar = "Ich bin innerlich";
Konsole.log (outvar);
Konsole.log (invar);
return Innerfunction ();
äußere Funktion ();
Wir erstellen eine Außenfunktion und ein Innerfunktion in der Außenfunktion. In der Innenfunktion greifen wir auf die Variable zu Outvar Welches ist die lokale Variable der Außenfunktion, und drucken ihren Wert zusammen mit dem Wert der Variablen innerhalb der inneren Funktion.
So funktioniert dieser Code:
Die Ausgabe des obigen Codes lautet:
Wir konnten die Werte beider Variablen erhalten und sie mit der Konsole in die Konsole ausdrucken Konsole.Protokoll() Funktion.
Wie man mehrere Funktionen in einer anderen Funktion in einem Verschluss hat
Wenn wir die äußere Funktion als die bezeichnen Elternfunktion der Schließung und der inneren Funktion als die Kinderfunktion der Schließung. Dann können wir es so ausdrücken, dass ein alleinerziehender Elternteil mehrere Kinder haben kann. Eine übergeordnete Funktion hat keinen Zugriff auf die Attribute ihrer Kinder. Jedes Kind hat jedoch Zugriff auf die Attribute seines Elternteils. Da eine untergeordnete Funktion auch ein Attribut des Elternteils ist, kann eine untergeordnete Funktion auch auf die anderen untergeordneten Funktionen desselben Elternteils zugreifen. Dies bedeutet, Zugang zu seinen Geschwistern zu haben.
Notiz: Parameter und Argumente sind auch für Kinder zugänglich.
Nehmen wir an, wir wollen eine Funktion erstellen, die eine Funktion begrüßt, die sie aufruft. Diese Funktion enthält 3 Parameter, FirstName, Middlenname und LastName.
Erstellen Sie zunächst die Funktion mit den folgenden Zeilen.
Funktionsgrüßer (FirstName, Middlenname, LastName)// spätere Befehle hier drinnen
Diese Begrüßungsfunktion ist eine übergeordnete Funktion mit vier Kindern. 3 der Kinder arbeiten an den Parametern und geben den Wert der Parameter zurück wie:
Funktion getFirst ()return FirstName;
Funktion getMiddle ()
Rückkehr Middlenname;
Funktion getLast ()
Rückkehr nach Lastname;
Das letzte Kind ruft alle seine Geschwister auf und druckt die Werte auf der Konsole, die mit den folgenden Zeilen implementiert werden:
Funktion nameprinter ()Konsole.Protokoll ("Willkommen! " + getFirst () +" " + getMiddle () +" " + getLast ());
Am Ende der übergeordneten Funktion Begrüßer () es gibt die zurück nameprinter () Kind zu dem Ort, an dem es genannt wird.
Um dieses Ganze auszuführen Schließung Wir müssen die übergeordnete Funktion mit der folgenden Zeile aufrufen:
Begrüßer ("John", "Bukhari", "Doe");Der vollständige Codeausschnitt dieser Schließung lautet:
Funktionsgrüßer (FirstName, Middlenname, LastName)Funktion getFirst ()
return FirstName;
Funktion getMiddle ()
Rückkehr Middlenname;
Funktion getLast ()
Rückkehr nach Lastname;
Funktion nameprinter ()
Konsole.Protokoll ("Willkommen! " + getFirst () +" " + getMiddle () +" " + getLast ());
return nameprinter ();
Begrüßer ("John", "Bukhari", "Doe");
Wir erhalten die folgende Ausgabe:
Abschluss
Der Verschluss ist ein Merkmal, das mit der ES6 -Veröffentlichung von JavaScript geliefert wurde. Verschlüsse sind die Implementierung des Konzepts, das auf dem Scoping von Variablen in JavaScript basiert. Wir haben gelernt, was Schließungen sind und da sie auf dem Scoping von Variablen basieren, haben wir auch über Scoping gelernt. Wir haben den Unterschied zwischen globalem Umfang und variabler Umfang in JS durchgemacht, und am Ende haben wir die Arbeit von Schließungen mit Hilfe von Beispielen getestet.