Detaillierte Einführung in den Variablenförderungsmechanismus in js

Variablenförderung

Es gibt zwei Arten der Variablenförderung in JavaScript: mit var deklarierte Variablen und mit function deklarierte Variablen.

Mit var deklarierte Variablen

Sehen wir uns zunächst den folgenden Code an: Was ist der Wert eines

Code 1

console.log(a);

var a;

Follow From Aus der Sicht der bisherigen Programmiersprache wird der Code von oben nach unten ausgeführt, da bei der Ausführung die zweite Zeile nicht definiert wurde und daher ein Fehler vorliegt nicht definiert

wird gemeldet. Tatsächlich ist die Antwort jedoch undefiniert

Okay, im Zweifel schauen wir uns den folgenden Code an

var a;
console.log(a);

Wir finden, dass diese beiden Teile Der Code ist derselbe, daher gibt es eine neue Frage: Es spielt keine Rolle, ob es eine Variable a gibt oder nicht. Die Antwort ist immer undefiniert, was die Illusion erzeugt, dass die Variable verbessert wird. Deshalb habe ich Code 3 geschrieben

Code 3

console.log(a);

Okay, es wurde endlich ein Fehler gemeldet, was beweist, dass der JavaScript-Code nicht von oben nach unten ausgeführt wird, zumindest oberflächlich betrachtet scheint es so.

Schauen wir uns also Code 4 an

Code 4

console.log(a);
var a = 2;

Da die Variable hochgestuft wird, lautet die Antwort 2, aber tatsächlich ist sie immer noch undefiniert, warum?

Zu diesem Zeitpunkt müssen wir den Compiler fragen, der für die Drecksarbeit wie Syntaxanalyse und Codegenerierung verantwortlich ist.

Wenn der Compiler var a = 2; sieht, behandelt er es als zwei Deklarationen, var a; und a = 2. Die erste Deklaration wird während der Kompilierungsphase vorgenommen und die zweite Deklaration lautet „Warten“. für die Ausführungsphase vorhanden.

Mit anderen Worten, der obige Code wird zum folgenden Code

var a;
console.log(a);
a = 2;

Also wird er am Ende undefiniert sein

Okay, ich werde mich ausführlich äußern, schauen Sie sich das an Dieser Code 5

Code 5

a = 2;
var a;
console.log(a);

Ich denke, jeder sollte bereits die tatsächliche Ausführungsreihenfolge dieses Codes und seine Antwort kennen. Ja, die Antwort ist 2, aber was ich sagen möchte Um die 2. Zeile zu ändern, ist die Antwort immer noch 2, aber das hat nichts mit der Variablenheraufstufung zu tun. Es handelt sich um eine Frage des strikten Modus und des nicht strikten Modus. Im nicht strikten Modus dürfen Entwickler dies nicht tun Schlüsselwörter zum Deklarieren von Variablen, aber im strikten Modus. Dies ist im Modus nicht möglich, es wird ein Fehler gemeldet.

Mit Funktion deklarierte Variablen

Wie var werden mit Funktion deklarierte Variablen weiterhin hochgestuft.

log(5);

function log(mes){
  console.log(mes)
}

Nach dem bisherigen Verständnis der Variablenförderung ist die tatsächliche Reihenfolge dieses Codes diese:

function log(mes){
  console.log(mes)
}

log(5);

Sehr gut, sehr richtig, dann schauen Sie sich den nächsten Codeabschnitt an

log(5);

var log = function(mes){
  console.log(mes)
}

Es wurde ein Fehler gemeldet, log ist keine Funktion. Hier können wir sehen, dass diese Art von Funktionsausdruck nicht hochgestuft wird. Versuchen Sie, vorne eine Codezeile hinzuzufügen. (log), undefiniert wird zuerst ausgegeben.

Die eigentliche Reihenfolge hier ist also

var log;
log(); //这时候只是声明了log这个变量，并不是函数，却用函数的方法调用它，所以会报错，说这不是一个函数。
log = function(mes){
  console.log(mes)
}

Verwenden Sie var, um Variablen in der Funktion zu deklarieren

Obwohl wir wissen, dass mit var deklarierte Variablen hochgestuft werden, tun wir das nicht Ich weiß nicht, inwieweit es verbessert wird?

Davor schauen wir uns einen Code an

var a = 4;

function foo(){
  var a = 5;
  console.log(a);

}
foo();

console.log(a)

Die Antwort ist 5,4, geben Sie zuerst 5 und dann 4 aus.

Mit var deklarierte Variablen haben einen Funktionsumfang, daher hat ein In-Foo keine Beziehung zu einem Außen-Foo. Diese Situation ist genau das, was ich will.

Ändern Sie den Code erneut

function foo(){
  a = 5
  console.log(a);
  var a;
}
foo();

console.log(a)

Die Antwort ist 5, a ist nicht definiert

Die 4. Codezeile gibt 5 aus und die 9. Zeile meldet einen Fehler.

In diesem Fall wird die Variablenheraufstufung nur an die Spitze des Bereichs befördert, in dem sich die Variable befindet, und nicht in den übergeordneten Bereich.

Wir können also eine Schlussfolgerung ziehen: Durch die Variablenförderung wird die Variable nur an die Spitze ihres eigenen Bereichs befördert.

Funktionspriorität

Da var und function verwendet werden Variablen haben die Funktion der Heraufstufung. Was passiert also, wenn dieselbe Variable mit beiden deklariert wird? Nun, Sie werden schon an der Überschrift erkennen, dass die Funktion Vorrang hat.

Schauen Sie sich den Code im Detail an

foo();

var foo;

function foo(){
  console.log(1)
}

foo = function(){
  console.log(2)
}

Die Antwort ist 1

Dieser Code sieht tatsächlich so aus

function foo(){
  console.log(1)
}

foo();// 1

foo = function(){
  console.log(2)
}

Schauen Sie genau hin, var foo ist weg , Ja, es wurde von der Engine ignoriert, die es als doppelte Deklaration betrachtete und wegwarf.

Okay, da mit var deklarierte Variablen nicht so gut sind wie Funktionsdeklarationen, verwenden Sie Funktionsdeklarationen, um dieselbe Variable mehrmals zu deklarieren.

foo()
function foo(){
  console.log(1);
}
foo()
function foo(){
  console.log(2);
}
foo()
function foo(){
  console.log(3);
}

foo()

foo wird dreimal deklariert und viermal aufgerufen. Das Ergebnis jedes Aufrufs ist 3, sodass die letzte Funktionsdeklaration die vorherige Funktionsdeklaration überschreibt

Aber var will immer noch kämpfen, ich Ich habe immer noch das Gefühl, dass es notwendig ist, mein Existenzgefühl zu beweisen.

foo()
function foo(){
  console.log(1);
}
var foo;
foo()
foo = function(){
  console.log(2);
}
foo()
function foo(){
  console.log(3);
}

foo()

Schauen Sie genau hin, der mittlere Teil des Codes wurde geändert und gibt 3,3,2,2 nacheinander aus

Obwohl var foo ignoriert wird, ist die folgende Funktion immer noch nützlich Code Es kann wie folgt gesehen werden:

function foo(){
  console.log(3);
}

foo();//3
foo();//3
foo = function(){
  console.log(2);
}
foo();//2
foo();//2

Deklarieren Sie die Funktion innerhalb des gewöhnlichen Blocks

Vorher wurde die Funktion im Bereich deklariert, jetzt deklarieren Sie die Funktion im Block

function foo(){

  console.log(b); // undefined
  b(); //TypeError: b is not a function

  var a = true;

  if(a){
    function b(){
      console.log(2)
    }
    //下面这段代码和上面的结果一样
    // var b = function(){
 //      console.log(2)
 //    }
  }
  //b() --> 这里会被执行

}

foo()

Aus dem oben Gesagten ist b undefiniert, was beweist, dass diese Variable noch existiert, aber keine Funktion ist. Diese Situation ähnelt der Verwendung eines Funktionsausdrucks.

Zusammenfassung

1. Die Förderung ist in die Förderung der Funktionsdeklaration und die Förderung der Variablendeklaration unterteilt.

2. Verwenden Sie var, um Variablen und Funktionen zu deklarieren.

3. Durch die Variablenheraufstufung wird die Variable an die Spitze ihres eigenen Gültigkeitsbereichs befördert.

Es gibt keinen Heraufstufungsmechanismus für Funktionsausdrücke.

5 Bezeichner gleichzeitig Symbol, die Funktionsdeklaration hat Priorität

6. Wenn mehrere Funktionen denselben Bezeichner deklarieren, überschreibt die letzte Deklaration die vorherige Deklaration

Empfohlenes Tutorial: JS-Tutorial

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in den Variablenförderungsmechanismus in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!