JavaScript Topics: Deklarationen und Umfang

1. Einführung: Willkommen bei JavaScript-Themen. Ein Siri, das sich auf einzelne Themen konzentriert. In JavaScript. Diese Themen sind fokussiert, sodass Sie Ihre begrenzte Zeit damit verbringen können, ein bestimmtes Feature-Muster oder Konzept zu lernen oder zu überprüfen . Werfen wir einen Blick auf, was in diesem Thema in Deklarationen in Scope behandelt wird. Die Zielliste von Ride, Ein vollständiges Verständnis von Scope in Java-Skript und wie die Deklarationsschlüsselwörter, var, Let und const unterscheiden sich und gelten für den Umfang. Scope ist ein kritisches Konzept, das zu verstehen ist, daher werden wir das zuerst in die Tiefe eingehen. Mit der Keyword-Leiste wird dann diskutiert und dann schließlich, const. Es sollte etwa 30 Minuten dauern, um dieses Thema zu vervollständigen, also springen wir direkt hinein. 2. Umfeld verstehen: Es ist wichtig, den Umfang in JavaScript zu verstehen, um zu verstehen, was Ihr Code tut, und um alle seine Fähigkeiten in diesem Video voll zu nutzen, werden wir einige Beispiele verwenden, um den Umfang und die Bereichskette zu veranschaulichen und Konzept verständlicher. Zunächst scheint es wichtig, den Umfang zu definieren. Scope ist einfach eine Reihe von Regeln, die bestimmen, wo innerhalb eines Programms auf referenzierte Elemente zugreifen können . Normalerweise bezieht sich das auf Variablen. Scope ist also eine Reihe von Regeln, die bestimmen, wo Sie auf die Variablen zugreifen können, die Sie deklariert haben. Nun Umfang nicht auf Variablen beschränkt, wie Sie in unseren Beispielen sehen werden, aber wir denken normalerweise an Variablen. Wenn wir über Geltungsbereich sprechen. Werfen wir nun einen Blick auf ein paar Konzepte, die mit dem Bereich verbunden sind. Nummer eins ist Geltungsbereich wird bestimmt. Lexical e. Was bedeutet das jetzt? Nun, als einfach bedeutet, dass, wenn Sie Ihr Programm fahren, wo Sie Deklaration von Variablen und Funktionen festgelegt sculpt platzieren, so dass es nichts damit zu tun hat , wenn eine Funktion aufgerufen wird oder wenn Ihr Code ausgeführt wird. Der Umfang wird durch die Art und Weise bestimmt, wie Sie Ihr Programm schreiben. Zweitens verwendet JavaScript Funktionsbereich, wenn eine neue Funktion deklariert wird, die den Bereich erstellt. Alles in JavaScript beginnt im globalen Bereich. Aber wie Sie beginnen, Funktionen zu erstellen, die auch Bereich und dann schließlich verschachtelte Funktionen erstellen. Wenn Sie also eine Funktion innerhalb deklarieren, wird eine andere Funktion, die eine verschachtelte Funktion erstellt, die erstellt, was wir eine Bereichskette nennen erklärt, was eine Bereichskette ist. Dies sind also die drei Konzepte, die wichtig sind, im Auge zu behalten, wenn wir durch diese Beispiele gehen . nun Lassen Sie unsnuneinen Blick auf den Code werfen, den wir für die Beispiele verwenden werden, die helfen, den Umfang zu erklären. Zuerst deklarieren wir Variable, wir weisen ihm die Zahl 10 zu. Dann haben wir eine Funktion, auf die wir mit add five verwiesen haben. Beide befinden sich im globalen Raum. Innerhalb der Ad-5-Funktion deklarieren wir Variable, die Nummer fünf zuweist. Dann haben wir die Information protokolliert, dass sie aus der übergebenen Nummer plus dieser Variablen resultiert . Wir deklarieren eine andere Funktion innerhalb der Ad-Five-Funktion. In der Tat deklarieren wir eine zweite Funktion bei 15, die innerhalb der Ad-Five-Funktion ist. Beide werden aufgerufen und eine Zahl wird in diese Funktionen übergeben. Lassen Sie uns nun einen Blick darauf werfen, welcher Bereich als Ergebnis dieses Codes erstellt wird. Hier ist ein Diagramm, das den Formenbau identifiziert, der durch den Code erstellt wird, den wir gerade angesehen . Der äußerste Bereich, den ich beschriftet habe, und dann die Funktion „Ad fünf“ erstellt den Bereich. Ich habe beschriftet, dass innerhalb der Advis-Funktion ist. Wir haben eine bei 10 Funktion, die Umfang schafft. Ich habe beschriftet, dass sehen, und wir haben eine Anzeige 15 Funktion, die Umfang erstellt. Ich habe beschriftet, dass d keine Notiz in der Form für B, C und D. Es enthält nicht die Definition der Funktion ist ein Teil ihres Geltungsbereichs. Es enthält die Variable, die übergeben wird, aber die Funktion befindet sich tatsächlich im äußeren Bereich. Zum Beispiel, wenn wir einen Blick auf Meer, Nummer zwei ist ein Teil des Bereichs siehe, aber die ad 10-Funktion ist ein Teil von sculpt. Sei jetzt. Lassen Sie uns den Code durchlaufen und sehen, wie sich der Umfang auf das auswirkt, was passiert. Also zuerst aus dem Pfeil zeigt auf unsere erste entschuldbare Anweisung, die einfach eine Variable A definiert und ihm die Zahl 10 zuweist, ist die nächste Execute Herbal Anweisung der Aufruf der ad five Funktion, und wir übergeben ein Nummer drei. Also gehen wir zur Ad-Five-Funktion. Das ist, wo die numb-Variable deklariert wird, so taub ist jetzt gleich drei. Aufgrund dieses Wertes , den wir übergeben haben, deklarieren wir dann die Variable B und ein Zeichen fünf. Jetzt stoßen wir auf die Konsul Dot Logs Anweisung. Nun dieses Konzert-Out-Log-Anweisung bewirkt, dass ein Nachschlagen für die beiden Variablen. Taub und sein erste sucht nach Numb innerhalb seines eigenen Bereichs. Es findet es in seinem eigenen Bereich und gibt daher drei zurück und sucht dann nach der Variablen, befindet sich in einem eigenen Bereich. Es findet es und gibt fünf zurück und druckt dann die Zahl acht aus, weil drei plus fünf acht ist. Jetzt gehen wir zur nächsten entschuldbaren Anweisung, die die Ad 10-Funktion aufruft, und es geht in einer Nummer drei. Also bei der Anzeige 10 Funktion taub zu wird ein Wert von drei zugewiesen. Dann gehen wir zum Konzertprotokoll. Das System durchsucht seinen eigenen Bereich, der Bereich für die Ad 10-Funktion, um sie zu finden, findet es und gibt drei zurück. Es sucht dann nach einem Es kann keine innerhalb von formen finden. Siehst du, also geht es zum nächst äußersten Bereich. Dies ist die Umfangskette, über die wir gesprochen haben. Der am nächsten äußersten Umfang ist. Es sucht nach der Variablen a innerhalb von Sculpt, wenn sie sie nicht finden kann. So geht es weiter in die Scope Chain. Es geht zum nächstgrößten äußeren Bereich, der Bereich A und Bereich ist. A ist zufällig der globale Bereich, so dass die Bereichskette im globalen Bereich stoppt. Wenn a nicht im globalen Bereich gefunden wird, wird es als nicht deklarierte Variable angesehen und verursacht eine Luft. jedoch Es findetjedocheine in diesem Bereich. Es gibt den Wert zurück und druckt dann drei plus 10, was 13 ist. Wir sind zur nächsten entschuldigbaren Aussage gegangen, die ein Aufruf ist, 15 hinzuzufügen und es geht in der Nummer drei. Numb drei wird mit dem Wert drei deklariert. Eine Variable siehe wird deklariert und ein Wert von 15 zugewiesen, und dann sucht die Konsul dot logs Anweisung zuerst nach taub drei. Es findet es in seinem eigenen Sculpt und gibt eine Drei zurück und sucht dann nach C, das es innerhalb seines eigenen Bereichs findet , und die Rückgabe von 15 fügt diese beiden zusammen und druckt 18. Die vier verschiedenen Bereiche, die wir uns hier angesehen haben, wurden durch die Art und Weise erstellt, wie wir den Mantel eingegeben haben, weil wir Funktionen innerhalb der Ad-5-Funktion verschachtelt haben, die innerhalb dieses Bereichs erstellt und auch eine Formenkette erstellt hat, , die es durchlaufen könnte, um Variablen zu finden, wenn es nach ihnen sucht. Nein, wirklich schnell. Was wäre, wenn wir eine Codezeile ändern würden? Die fettgedruckte ID-Zeile ist die Kälte, die geändert wurde, anstatt sich auf Variable A zu beziehen Sie bezieht sich nun auf die Variable Siehe. Ist das also möglich? Variable Siehe ist tatsächlich nur innerhalb des Bereichs D deklariert Scope D ist kein Teil der Bereichskette für den Bereich. Siehe, daher würde eine Luft erzeugt werden. Im Grunde, was passieren würde, ist, dass es nach der Variablen suchen würde siehe innerhalb des Bereichs, Siehe konnte es nicht finden. Es geht zum nächsten äußeren Bereich, was B ist. Ich kann es nicht finden, dann geht in ein Lager, findet es eine Luft erzeugt. Alles klar, ein weiteres Beispiel mit Änderungscode. Also hat sich diese Linie wieder geändert. Also wird die Variable a verwendet, aber innerhalb der Funktion unten. Füge 15 hinzu. Wir haben die konstante log-Anweisung geändert, um einfach die Funktion aufzurufen, 10 hinzuzufügen und eine Zahl von drei zu übergeben. Wird das gut funktionieren? Wenn diese Funktion aufgerufen wird, sucht sie nach der Funktion innerhalb von sculpt D. Es wird sie nicht finden. Es wird dann in den äußeren Bereich gehen, was ist Umfang sein? Kann er es dort finden? Ja, die Ad 10-Funktion wird innerhalb des Bereichs deklariert. Sei so, dass es es es findet und führt es aus. Jetzt. Bevor ich dieses Video fertigstelle, verifiziere ich gerne alles, worüber wir gesprochen haben, indem ich den eigentlichen Code ausführe. Also lasst uns das jetzt machen. Alles klar, hier ist der eigentliche Code. Es ist an diese HTML-Seite angehängt. Also, wenn es ausgeführt wird, sollten wir acht, 13 und 18 bekommen . Ich werde das auffrischen. Öffne die Konsole 8 13 und 18. Jetzt lassen Sie uns schnell die Änderungen vornehmen, die wir zuvor gesprochen haben. Wenn ich diese Variable ändern, um zu sehen, wie ich erwähnt habe, würden wir einen Luftsprung ausführen lassen. Sicher genug, wir bekommen dort eine Referenz. Siehe ist nicht definiert, da sie sehen in seiner Bereichskette nicht finden kann. Lassen Sie uns das wieder zu einem ändern. Und jetzt rufen wir statt Konzertprotokoll an, das heißt Add 10 vorbei eine Drei. Also, wenn das funktioniert, sollten wir 8 13 und 13 bekommen. Und sicher genug, das ist es, was wir bekommen. Noch ein Kommentar, bevor wir das Konzept des Geltungsbereichs verlassen. Ja. Six Yes, 2015 führte ein neues Schlüsselwort für die Deklaration von Variablen ein. Lassen Sie das einen anderen Bereich als Var erstellen. Lassen Sie uns das, worüber wir im nächsten Thema sprechen werden, also gehen wir weiter. 3. Die Differenz zwischen Var und Lass: der ES-Sechs-Standard bot eine neue Möglichkeit, Variablen zu definieren. Lassen Sie uns also einen Blick auf den Unterschied zwischen Var und lassen Sie uns jetzt. Der Hauptunterschied besteht darin, wie die Variablen umfassend sind. Allerdings gibt es auch einen anderen Unterschied, und es hat mit Heben zu tun. Also zuerst ist der Umfang der Variablen, die mit bar deklariert sind, die Funktion selbst, oder wenn sie als globale Variable deklariert werden, ist es die globale Umgebung, während Variablen, die mit deklariert werden, den Umfang dieser Variablen ist einfach der Codeblock, der Codeblock, der in geschweiften Klammern enthalten ist. Nun, Heben betrifft, werden Variablen, die mit latte deklariert sind, nicht gehisst, während die mit weit deklarierten, Werfen wir einen Blick auf beide Beispiele werfen. Also zuerst habe ich eine einfache Funktion, die einfach eine Variable an der Konsole protokolliert. Ich rufe diese Funktion online an. Sieben. jedoch Die Variable wirdjedocherst in Zeile 10 deklariert und momentan verwende ich BAR. Wir werden uns das Heben in diesem ersten Beispiel ansehen. Es ist lassen Sie mich gehen und aktualisieren Sie meine Webseite und zeigen Sie die Konsole und sehen, was wir haben. Es zeigt an, dass die Variablen undefiniert haben wir keinen Wert zugewiesen, aber es gibt uns keine Luft, dass die Variable nicht existiert. Daher wurde die Deklaration der Variablen an die Spitze des Codes gehoben, aber die Zuweisung blieb dort, wo wir sie innerhalb des Codes platziert hatten. Was ist der Unterschied, wenn wir dies ändern, um jetzt in beiden Situationen zu lassen, dies ist in der globalen Umgebung, so dass der Umfang der Variablen für unsere und latte in der globalen Umgebung ist der gleiche. Aber mal sehen, was mit dem Heben passiert. Aktualisieren Sie erneut, öffnen Sie die Konsole und beachten Sie. Jetzt bekommen wir eine Referenz dort. X ist nicht definiert, also wurde es nicht mit let angehoben, wo es mit bar war. zweite Beispiel in diesem Beispiel hat eine Funktion, die sich wieder beim Konsul meldet, aber eine Vier-Schleife durchläuft, und es protokolliert den Wert von I an den Konsul jedes Mal, wenn wir durch die vier Schleife gehen. Sobald die vier Schleife abgeschlossen ist, dann protokolliert ich noch einmal Now. In diesem ersten Beispiel deklarieren wir I mit bar. Gehen wir weiter und rufen Sie diese Funktion an und sehen, was passiert. Aktualisieren Sie die Konsole 1234 und dann fünf. Dies ist die endgültige Konsul-Erklärung hier, weil die Vier-Schleife so lang war, wie sie weniger als fünf war . In Ordnung, jetzt lasst uns den Zeh ändern. Erinnern Sie sich nun, lassen Sie den Umfang der Variablen auf den Codeblock definieren. Da ist unser Codeblock. Mal sehen, was passiert, wenn wir versuchen, ich an der Konsole in Zeile 15 zu loggen. Speichern Sie diese Aktualisierung. Wir bekommen die 1. 4 gut. Aber sobald wir zu dieser letzten Konzertlog-Anweisung kommen, erhalten wir dort eine Referenz, wo ich nicht definiert ist. Und das liegt daran, dass ich mit let definiert wurde, so dass der Umfang begrenzt ist. Hoffentlich helfen Ihnen diese beiden Beispiele, den Unterschied zwischen var zu sehen und lassen Sie mich denken, dass eine der besten Möglichkeiten zu lernen ist, indem Sie verschiedene Dinge in Ihrem Code ausprobieren und herausfinden, was passiert. Also in dem Projekt für diesen Kurs werde ich Sie genau das tun lassen. Sie spielen mit dem Code im vorherigen Thema zur Verfügung gestellt und nehmen Änderungen vor, um den Unterschied zwischen lassen und bar zu sehen . Aber bevor ich das Projekt beschreibe, müssen wir über Const sprechen. Also lasst uns weitermachen 4. Konstanten mit Konst erstellen: wir haben ein weiteres ES sechs Thema Konstanz erstellen. Dies geht mit dem Erstellen von Variablen zusammen, weil es eine sehr ähnliche Struktur ist. Eine Konstante ist ein Container, der den Wert enthält, die Hauptunterschiede. Sie können sie nicht einmal außer Wert ändern, der dem Container zugewiesen ist. Sehen wir uns das an. Die Syntax zum Einrichten einer Konstante ist sehr ähnlich. Der einzige Unterschied ist anstelle unserer oder latte Jahre, das Wort const. In der Vergangenheit und Java-Skript, wenn Programmierer angeben wollten, dass ein Wert nicht geändert werden sollte, würden sie den Variablennamen dann in alle Großbuchstaben setzen, da sie Programmierung waren, die wissen würde, dass dies ein konstanter Wert ist. Dies ist ein Wert, den wir nicht ändern wollen. Das ist eine gute Praxis, um fortzufahren. Ich denke, wenn Sie das Schlüsselwort const verwenden, um eine Konstante yes zu deklarieren, sechs hat es möglich gemacht, so dass Sie jetzt einen Container erstellen können, einen Container mit variablem Typ, Sie daran hindert, eine Änderung daran vorzunehmen. Wenn wir also diese Konstante pi den Wert von 3.14 signieren, können wir dann darauf verweisen und es kommt zurück und zeigt es an, aber beachten Sie, dass wir es nicht ändern können. Auch wenn der Änderungswert korrekt ist, gibt er uns im Grunde eine Luft. Es gibt also Situationen, in denen Sie ein konstantes etwas verwenden möchten, das unveränderlich ist. In diesem Fall möchten Sie es mit Konstante deklarieren. Nun, wie vergleicht der Umfang von Const mit var und lassen Sie so kosten ist Blockbereich, der genau so ist wie lassen Sie, so dass die Diskussion, die wir über let hatten, auf const angewendet wird. Jetzt gibt es noch eine Sache, die wir über Constant erwähnen müssen. Es ist wichtig, sich daran zu erinnern, dass Const Onley die Wertzuweisung einschränkt. Es gibt keine Einschränkung für den Wert selbst. Also, was bedeutet das? Praktisch gut, lassen Sie mich illustrieren. Also werde ich zwei Dinge mit CONST erklären. Dieses Jahr ist eine Zahl. Es ist ein Primitiv. Da es primitiv ist, können wir den Wert überhaupt nicht ändern. Und weil es mit const deklariert wird, können wir es nicht neu zuweisen. Jetzt ist die zweite Sache wird Benutzer sein, um Objekt zu finden. Okay, da haben wir zwei Deklarationen mit Const. Gehen wir weiter und werfen einen Blick auf diese. Wenn ich also Kuchen in der Konsole anschaue, kann ich darauf verweisen. Aber wie wir gesehen haben, kann ich es nicht ändern. Es gibt mir eine Luft. Wenn ich das jetzt mache, werfen wir einen Blick auf die anderen 10 b. J. J. Ich kann darauf hinweisen, dass ich es betrachten kann. Mal sehen, ob wir versuchen, es in etwas anderes zu ändern. Vielleicht nur eine Nummer. Nein, es gibt mir einen Erben. Das kann ich nicht. Aber hier ist etwas, was ich tun kann. Ich kann das Objekt ändern, weil es ein Objekt ist. Und Objekte in Javascript sind unveränderlich. Ich kann es ändern. So konnte ich auch den Namen setzen. Etwas anderes. Und es wird weitergehen und das ändern. Das meine ich also. Wenn ich sage, ist die Einschränkung bei der Wertzuweisung. Es ist nicht auf dem Wert selbst, weil Objekte in JavaScript unveränderlich sind, können wir diese weiter ändern. Wo würden Sie Const verwenden? Nun, jetzt ein paar Tage. Sie werden sehen const Verwendung an vielen Orten. Es wird häufig für Variablen verwendet, die Funktion speichern. Und der Grund dafür ist, dass Sie nicht etwas anderes für diese Variable signieren möchten. Wenn Sie eine Funktion darin gespeichert haben, etwas, das Ihnen vielleicht bewusst ist oder Sie vielleicht gesehen haben, dass Const. Ist in vielen Fällen zur Deklaration der Wahl geworden, weil es viele Dinge in Ihrem Code gibt , denen Sie keinen neuen Wert zuweisen möchten. Und das macht Sinn. jedoch Sie könnenjedochauch überlegen, was Const den anderen Entwicklern kommuniziert. Grundsätzlich heißt es, dass dies nicht geändert wird, also zögere ich, es mit Dingen wie üblich zu verwenden, um Objekte zu finden und dauert. Ich habe nicht vor, dieses Objekt zu ändern. Ich möchte nicht, dass dieses Objekt geändert oder das Objekt eingefroren wurde. Aber wenn das Objekt unveränderlich sein wird, dann werde ich erklären, dass es etwas anderes war, je nachdem, was ich den Umfang haben möchte. Und das ist eine andere Sache zu tun, zu betrachten lassen und const austauschbar verwirrt, weil ihr Umfang der gleiche ist. Aber wenn Sie einen anderen Bereich möchten, müssten Sie Bar verwenden. In Ordnung. Im nächsten Thema werde ich das Projekt zu diesem Jobstreifen-Thema erklären 5. Projekt: eine der besten Möglichkeiten, JavaScript zu lernen, besteht darin, verschiedene Dinge auszuprobieren und herauszufinden, was passiert. Also für das Projekt möchte ich, dass Sie genau das tun. zuerst Laden Siezuerstden Code aus dem Projekt herunter, dass kalt genau wie der Code aussieht, der in der Diskussion über den Umfang präsentiert wird . Sie werden feststellen, dass der Mantel ausschließlich unsere verwendet einige Änderungen vornehmen und herausfinden, was passiert. Verwenden Sie. Lassen Sie Const verwenden. Probieren Sie einige Dinge aus, sehen Sie, was passiert, dann Nehmen Sie eine Bildschirmaufnahme Ihrer co Änderungen oder laden Sie die Codedatei hoch oder können mit einigen verknüpft werden, Cody schrieb in Code Pen an Code geschrieben ein IoT. Dann schreiben Sie eine Beschreibung dessen, was Sie lernen. Auf diese Weise können wir alle voneinander lernen, was eine weitere wichtige Möglichkeit ist, Java-Skript zu lernen. Probieren Sie es also aus und danken Sie dafür, dass Sie Teil dieses JavaScript-Thema sind. Erklärungen und Geltungsbereich