Warum meldet dieser JavaScript-Code „1' statt „10'?

JavaScript Hoisting und Scoping anhand eines faszinierenden Beispiels verstehen

In einem kürzlich erschienenen Artikel beleuchtet Ben Cherry die faszinierenden Konzepte von JavaScript für Hoisting und Scoping . Zur Veranschaulichung präsentiert er den folgenden Code:

var a = 1;

function b() {
    a = 10;
    return;

    function a() {}
}
b();
alert(a);

Erwartung vs. Realität

Intuitiv könnte man erwarten, dass die Warnung „10“ anzeigt, da die Funktion a wird innerhalb von b deklariert. Der Browser zeigt jedoch stattdessen „1“ an.

Eintauchen in Hoisting und Scoping

Hoisting ist ein Phänomen, bei dem Funktionen an die Spitze ihres Geltungsbereichs verschoben werden. Das bedeutet, dass der folgende Code vom Interpreter neu geschrieben wird:

function b() {
  a = 10;
  return;
  function a() {}
}

Interessanterweise ermöglicht JavaScript auch die Variablendeklaration innerhalb von Funktionen mithilfe der Syntaxfunktion a() {}. Dies entspricht var a = function () {};.

Verstehen der Ausführungssequenz

Der Code funktioniert im Wesentlichen wie folgt:

• a ist im globalen Gültigkeitsbereich mit dem Wert 1 definiert.
• Die Funktion b ist deklariert und gehisst.
• Innerhalb von b wird eine Variable a im lokalen Bereich mithilfe der Funktion a() {} deklariert (entspricht var a = function () {};). Dadurch wird eine separate Instanz von a erstellt.
• a wird dann im lokalen Gültigkeitsbereich mit dem Wert 10 überschrieben.
• b kehrt zurück und die lokale Instanz von a verlässt den Gültigkeitsbereich.
• alert(a) greift auf die globale Variable a zu, die immer noch den Wert 1 enthält.

Daher zeigt die Warnung „1“ an anstelle von „10“, da die globale Variable a von den Änderungen, die an der lokalen Variablen a innerhalb der Funktion vorgenommen werden, nicht betroffen ist.

Das obige ist der detaillierte Inhalt vonWarum meldet dieser JavaScript-Code „1' statt „10'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!