JavaScript Heben
Hoisting ist das Standardverhalten von JavaScript, um Deklarationen nach oben zu verschieben.
JavaScript-Deklarationen werden gehisst
In JavaScript kann eine Variable deklariert werden, nachdem sie verwendet wurde.
Mit anderen Worten; eine Variable kann verwendet werden, bevor sie deklariert wurde.
Beispiel 1 liefert das gleiche Ergebnis wie Beispiel 2 :
Beispiel 1
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
var x; // Declare x
Beispiel 2
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
Um das zu verstehen, muss man den Begriff „Heben“ verstehen.
Hoisting ist das Standardverhalten von JavaScript, bei dem alle Deklarationen an den Anfang des aktuellen Gültigkeitsbereichs verschoben werden (an den Anfang des aktuellen Skripts oder der aktuellen Funktion).
Die Schlüsselwörter let und const
letMit und definierte Variablen constwerden an den Anfang des Blocks gehoben, aber nicht initialisiert .
Bedeutung: Der Codeblock kennt die Variable, aber sie kann nicht verwendet werden, bis sie deklariert wurde.
Die Verwendung einer letVariablen vor ihrer Deklaration führt zu einer
ReferenceError.
Die Variable befindet sich vom Beginn des Blocks bis zu ihrer Deklaration in einer "zeitlichen Totzone":
Beispiel
Dies führt zu einemReferenceError:
carName = "Volvo";
let carName;
Die Verwendung einer constVariablen, bevor sie deklariert ist, ist ein Syntaxfehler, sodass der Code einfach nicht ausgeführt wird.
Beispiel
Dieser Code wird nicht ausgeführt.
carName = "Volvo";
const carName;
Lesen Sie mehr über let und const in JS Let / Const .
JavaScript-Initialisierungen werden nicht gehisst
JavaScript hisst nur Deklarationen, keine Initialisierungen.
Beispiel 1 liefert nicht das gleiche Ergebnis wie Beispiel 2 :
Beispiel 1
var x = 5; // Initialize x
var y = 7; // Initialize y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
Beispiel 2
var x = 5; // Initialize x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
var y = 7; // Initialize y
Macht es Sinn, dass y im letzten Beispiel undefiniert ist?
Dies liegt daran, dass nur die Deklaration (var y), nicht die Initialisierung (=7) nach oben gehoben wird.
Aufgrund von Hoisting wurde y deklariert, bevor es verwendet wird, aber da Initialisierungen nicht gehisst werden, ist der Wert von y undefiniert.
Beispiel 2 ist dasselbe wie das Schreiben:
Beispiel
var x = 5; // Initialize x
var y; // Declare y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
y = 7; // Assign 7 to y
Deklarieren Sie Ihre Variablen ganz oben!
Hoisting ist (für viele Entwickler) ein unbekanntes oder übersehenes Verhalten von JavaScript.
Wenn ein Entwickler das Heben nicht versteht, können Programme Fehler (Fehler) enthalten.
Um Fehler zu vermeiden, deklarieren Sie immer alle Variablen am Anfang jedes Geltungsbereichs.
Da JavaScript den Code so interpretiert, ist dies immer eine gute Regel.
JavaScript im strikten Modus lässt die Verwendung von Variablen nicht zu, wenn sie nicht deklariert sind.
Studieren Sie „use strict“ im nächsten Kapitel.