Beispiel Für Javascript-Schließung

| | | | | | | | | | | | | | | | | | | | | | | | |

Eines der wichtigsten Passwörter in JavaScript ist das Herunterfahren. Er ist Gegenstand vieler Fragen zu Vorstellungsgesprächen bei FAANG-Unternehmen. In diesem Artikel sprechen wir über Zaun und Tor, veranschaulichen die Konzepte mit einfachen Beispielen und schließen dann mit einer Beispielfrage aus einem Interview mit einem der größten Technologiegiganten ab.

Wenn Ihnen jemand sagt, dass etwas Teil eines Projekts ist oder nicht, was bedeutet das?

Ich würde gerne an ein Periskop oder ein Teleskop denken wenn ich an die Antwort auf diese Frage denke. Diese Tools zeigen uns alle möglichen Dinge innerhalb der Grenzen der Linse, die er hat: Er ist im Feld. Wenn es sich außerhalb des Bereichs befindet, können Sie nicht über den Durchmesser des Objektivs hinaussehen. Und etwas außerhalb des Durchmessers zu beleuchten ist nicht möglich. Sie sollten darüber nachdenken, da wir über drei sehr wichtige und unterschiedliche Arten von Geltungsbereichen in JavaScript sprechen: lokal, global und lexikalisch.

Lokaler Geltungsbereich

Der lokale Geltungsbereich ist der kleinste die drei Anwendungsbereiche, die wir heute besprechen werden. Wenn wir eine Funktion deklarieren, gilt alles, was in eckige Klammern ({}) eingeschlossen ist, als lokal für die Funktion. Wenn die JavaScript-Engine die Funktion liest, deklariert sie die Variablen; wenn es endet, werden die Variablen zerstört.

Wie Sie sehen können, wenn "console.log ()" das Ergebnis der aufgerufenen Begrüßungsfunktion ist, können wir nach dem auf den WebsiteName zugreifen Funktion gespielt wurde. Dadurch erhalten wir den Kanal „Hello Karma Career“, nach dem wir gesucht haben. Wie bereits erwähnt, generiert die console.log () der in der Funktion deklarierten Variable einen Fehler, da sie nicht definiert werden kann .

, der Grund, warum WebsiteName undefiniert ist, liegt darin, dass Variablen beim Aufrufen von Funktionen erstellt und dann zerstört werden, wenn die Terminal-Anweisung ausgeführt wird. Alles außerhalb der Funktion hat keinen Zugriff auf Dinge innerhalb der Funktion, es sei denn, es ist hat eine bestimmte Konfiguration.

globale Reichweite

Dieses nächste Feld ist so ziemlich eine wörtliche Übersetzung des Ausdrucks: Ein globaler Geltungsbereich nimmt Elemente, die außerhalb einer Funktion deklariert werden, und reserviert sie in einem Leerzeichen wo alle Skripte, Methoden und Funktionen darauf zugreifen und sie für ihre eigene Logik verwenden können.

Was macht der obige Code, wenn console.log () am Ende des Codes zählt? Was hoffen Sie, wird passieren?

Schauen wir uns den Code an: .

  1. variable counter in der globalen Umgebung deklariert und gestartet
  2. Eine in der globalen Umgebung deklarierte Funktion hinzugefügt.
  3. Add wird aufgerufen.
  4. die Zählervariable, die in der Locale deklariert und gestartet wurde .
  5. erhöht sich der lokale Zähler um 1 ‚áê, weil lokal und nicht global?
  6. Der Zähler wird zurückgegeben. Die Enden der Funktion.
  7. Add wird erneut aufgerufen
  8. Führen Sie die Schritte 4 bis 6 aus.
  9. Wiederholen Sie die Schritte 3 erneut 6.a
  10. console.log (counter), was wird zurückgegeben?

Da die Funktion immer dann endet, wenn der Counter 1 ist, wird unsere lokale Counter-Variable wieder deklariert und bei jeder Ausführung der Funktion bei 0 neu gestartet. Was auch immer passiert, der Zähler stoppt lokal immer bei 1.

Wenn eine Funktion eine Variable innerhalb ihres Geltungsbereichs findet, sucht sie nicht nach dem globalen Geltungsbereich der Variablen – die globale Variable ändert sich also nie. Dann generiert unsere console.log () 0, da unsere Variable, die am nächsten in der Umgebung dieser Anweisung definiert ist, in der globalen Umgebung liegt.

Lexikalischer Gültigkeitsbereich

Der lexikalische Gültigkeitsbereich ist eines der grundlegenden Konzepte von JavaScript. Es ist die Idee, dass die Erstellung einer Funktion oder einer Variablen für bestimmte Teile des Codes zugänglich ist und daher für andere Teile des Codes nicht zugänglich ist. Es hängt alles davon ab, wo sich die Deklaration der einzelnen Variablen und Funktionen befindet.

Sehen wir uns diesen Codeblock an:.

Hier haben wir eine Reihe von verschachtelten Funktionen. Die Funktion init () deklariert eine Variable namens var1, deklariert eine Funktion namens second und ruft second () auf.

Wenn der Compiler diesen Code zum ersten Mal durchgeht, untersucht er auf hoher Ebene, was wir haben:

An diesem Punkt können wir nichts anderes innerhalb der init() sehen - wir wissen nur, dass die Funktion existiert, wenn unsere init()-Funktion aufgerufen wird, der Compiler wirft einen weiteren Blick auf den Inhalt der Funktion auf hoher Ebene:

  1. var1.
  2. seconds ()
  3. second () ruft auf

der init () weiß nichts darüber, was innerhalb des seconds () -Blocks vor sich geht, er kann nur sehen was in seiner lexikalischen Umgebung vorhanden ist - der umgebende Zustand.

Jede verschachtelte Funktion befindet sich in einem kleineren Container, wie z Seite zum Beispiel, wenn Sie nicht sicher sind, was sie sind). Die Puppen auf ihr wissen, was in ihrem Behälter vor sich geht und was bereits passiert ist oder in den Eltern gelesen / gelesen wurde. Die größere Puppe zum Beispiel weiß nur, dass die nächste Puppe in ihrem Container existiert. Sie kennt keine der anderen Puppen im Set, nur was sich in ihrer lexikalischen Umgebung (ihr Zustand) befindet und was bereits passiert ist (das äußere Reich).

Eigentlich wissen wir zwei Dinge:.

  1. Außendomäne kann interne Domäne nicht sehen
  2. Der interne Bereich hat Zugriff auf die externe Domäne.

Da die Außenwelt nicht sehen kann, was drinnen vor sich geht, können wir mit Sicherheit sagen, dass dies eine einseitige Beziehung ist. Das Innere kann die Variablen des Äußeren sehen und verwenden, aber das Äußere kann das Innere nicht sehen. Dies nennt man lexikalische Finalität .

Das Schöne am lexikalischen Gültigkeitsbereich ist, dass der Wert einer Variablen durch ihre Platzierung im Code bestimmt wird . Funktionen suchen zuerst nach der Bedeutung einer Variablen in ihrem Gebietsschema - wenn sie sie nicht finden können, gehen sie zu der Funktion, die diese Funktion definiert. Wenn es dort nicht gefunden wird, geht es in der Kette nach oben zur nächsten definierten Funktion.

Dies wird zu einem sehr wichtigen Konzept in JavaScript, das immer wieder auftaucht, wenn Sie mehr lernen über das JavaScript-Framework und wie es funktioniert. Sie können von außen gehen, aber Sie können niemals in die andere Richtung "nach oben" gehen. Dies ist sehr wichtig, wenn es um das betreffende Hauptthema geht: Abschluss .

Closure

Die Definition von Closure ist der eines lexikalischen Gültigkeitsbereichs sehr ähnlich.Der Hauptunterschied zwischen den beiden besteht darin, dass Closure eine Funktion höherer Ordnung ist und lexikalischer Gültigkeitsbereich nicht. Eine Funktion höherer Ordnung hat ein grundlegendes Merkmal: Sie gibt eine Funktion zurück oder verwendet eine Funktion als Parameter.

Die Closure ist eine Funktion, die sogar ihren lexikalischen Gültigkeitsbereich erreichen kann wenn diese Funktion später aufgerufen wird.

Sowohl Abschluss als auch lexikalischer Gültigkeitsbereich haben ihre eigenen Variablen, können auf Variablen und Parameter einer übergeordneten Funktion zugreifen und globale Variablen verwenden. mit dem folgenden Code:

  1. Greeting() die Funktion existiert, aber wir kennen den Inhalt noch nicht.
  2. greetUser existiert, aber ich kenne seinen Inhalt noch nicht
  3. greetUser () - diese Zeile ruft die vorherige auf, die wiederum die Begrüßung ( )-Funktion.
  4. userName deklarieren
  5. welcomeGreeting () existiert, aber ich kenne den Inhalt noch nicht
  6. Die Return-Anweisung unter dem Block welcomeGreeting () gibt dieselbe Funktion zurück
  7. console.log (`Hello,` + username) ; Unser console.log hier kann auf den übergeordneten Gültigkeitsbereich zugreifen, um den Wert von userName zu erhalten.
  8. Deklaration des Terminals, die die Funktion beendet und die Bedeutung der Variablen im Codeblock zerstört.
  9. In diesem Code übergeben wir Informationen, indem wir Funktionen miteinander verschachteln, damit wir später auf den Wurf der Eltern zugreifen können



    Fazit

    In diesem Artikel haben wir ein ziemlich schweres JavaScript-Thema behandelt: Geltungsbereich und Schließungen. Ich würde empfehlen, sich zu verzweigen und mehrere Artikel zu diesem Thema zu lesen. Die Art und Weise, wie dies gelehrt wird, kann aus verschiedenen Perspektiven kommen – was natürlich bedeutet, dass es viele Arten des Lernens gibt. Ich hoffe, Sie fanden dieses alphabetische Buch nützlich! Viel Glück bei Ihrem weiteren Studium über Schließungen!