Heim > Web-Frontend > js-Tutorial > Ausführliche Interpretation des Hebemechanismus in JavaScript_Grundkenntnisse

Ausführliche Interpretation des Hebemechanismus in JavaScript_Grundkenntnisse

WBOY
Freigeben: 2016-05-16 15:45:40
Original
1068 Leute haben es durchsucht

Hebemechanismus

Die Variablendeklaration von Javascript verfügt über einen Hebemechanismus. Wenn die JavaScript-Engine ausgeführt wird, werden alle Variablendeklarationen an den Anfang des aktuellen Bereichs verschoben.

Schauen Sie sich zuerst einen Code an

var v = "hello";
(function(){
 console.log(v);
 var v = "world";
})();
Nach dem Login kopieren

Was ist das Ergebnis der Ausführung dieses Codes?
Die Antwort lautet: undefiniert
Dieser Code veranschaulicht zwei Probleme,
Erstens deckt die Variable v im Funktionsbereich die obere Bereichsvariable v ab. Nehmen Sie weniger Änderungen am Code vor

var v = "hello";
if(true){
 console.log(v);
 var v = "world";
}  
Nach dem Login kopieren

Das Ausgabeergebnis ist „Hallo“, was darauf hinweist, dass JavaScript keinen Gültigkeitsbereich auf Blockebene hat. Funktionen sind die einzigen Strukturen in JavaScript, die einen eigenen Gültigkeitsbereich haben.

Zweitens wird innerhalb des Funktionsumfangs die Deklaration der Variablen v gefördert. Der ursprüngliche Code entspricht also:

var v = "hello";
(function(){
 var v; //declaration hoisting
 console.log(v);
 v = "world";
})();  
Nach dem Login kopieren

Deklaration, Definition und Initialisierung

Die Deklaration deklariert die Existenz eines Namens, die Definition weist Speicherplatz für den Namen zu und die Initialisierung weist dem durch den Namen zugewiesenen Speicherplatz einen Anfangswert zu.
Verwenden Sie C, um diese drei Konzepte auszudrücken

extern int i;//Dies ist eine Aussage, die angibt, dass der Name i bereits irgendwo existiert
int i;//Dies dient dazu, den Namen i zu deklarieren und zu definieren und Speicherplatz für i zuzuweisen
i = 0;//Dies ist der Initialisierungsname i, der einen Anfangswert von 0 zuweist
Dies ist in Javascript der Fall

var v;//Variable v deklarieren
v = "hello";//(Variable v definieren und) initialisieren
Da JavaScript eine dynamische Sprache ist, haben ihre Variablen keinen festen Typ und die Größe ihres Speicherplatzes ändert sich mit der Initialisierung und Zuweisung. Daher ist die „Definition“ ihrer Variablen nicht dieselbe wie bei herkömmlichen statischen Sprachen seine Definition ist irrelevant.

Beförderungserklärung

Deklarationen innerhalb des aktuellen Bereichs werden an den Anfang des Bereichs verschoben, einschließlich Deklarationen von Variablen und Funktionen

(function(){
 var a = "1";
 var f = function(){};
 var b = "2";
 var c = "3";
})();  
Nach dem Login kopieren


Die Deklaration der Variablen a, f, b, c wird an den Anfang des Funktionsbereichs verschoben, ähnlich wie folgt:

(function(){
 var a,f,b,c;
 a = "1";
 f = function(){};
 b = "2";
 c = "3";
})();
Nach dem Login kopieren

Bitte beachten Sie, dass Funktionsausdrücke nicht hochgestuft werden, was auch den Unterschied zwischen Funktionsausdrücken und Funktionsdeklarationen ausmacht. Schauen wir uns die Unterschiede zwischen den beiden genauer an:

(function(){
 //var f1,function f2(){}; //hoisting,被隐式提升的声明

 f1(); //ReferenceError: f1 is not defined
 f2();

 var f1 = function(){};
 function f2(){}
})();  

Nach dem Login kopieren

Die Funktionsdeklaration f2 im obigen Code wird heraufgestuft, sodass ein früherer Aufruf von f2 kein Problem darstellt. Obwohl die Variable f1 ebenfalls heraufgestuft wird, ist der Wert von f1 nach der Heraufstufung undefiniert und ihr tatsächlicher Anfangswert wird zugewiesen, wenn der Funktionsausdruck ausgeführt wird. Es wird also nur die Aussage gefördert.

Namensauflösungsanordnung

Ein Name in JavaScript gelangt auf vier Arten in den Gültigkeitsbereich, und ihre Prioritätsreihenfolge ist wie folgt:
1. Integrierte Sprache: Alle Bereiche verfügen über dieses Schlüsselwort und Argumente
2. Formale Parameter: Die Parameter der Funktion gelten im Funktionsumfang
3. Funktionsdeklaration: in Form der Funktion foo() {}
4. Variablendeklaration: in Form von var bar;

Die Priorität der Namensdeklaration ist wie oben gezeigt, d. h. wenn der Name einer Variablen mit dem Namen der Funktion übereinstimmt, überschreibt der Name der Funktion den Namen der Variablen, unabhängig von ihrer Reihenfolge im Code. Die Namen werden jedoch in der Reihenfolge initialisiert, in der sie im Code geschrieben sind, und sind von den oben genannten Prioritäten nicht betroffen. Schauen Sie sich den Code an:

(function(){
  var foo;
  console.log(typeof foo); //function

  function foo(){}

  foo = "foo";
  console.log(typeof foo); //string
})();  

Nach dem Login kopieren

Wenn in den formalen Parametern mehrere Variablen mit demselben Namen vorhanden sind, überschreibt der letzte Parameter mit demselben Namen die anderen Parameter mit demselben Namen, auch wenn der letzte Parameter mit demselben Namen nicht definiert ist.

Es gibt Ausnahmen von den oben genannten Namensauflösungsprioritäten, z. B. die Möglichkeit, die integrierten Namensargumente der Sprache zu überschreiben.

Benannter Funktionsausdruck

Einem Funktionsausdruck kann wie einer Funktionsdeklaration ein Name gegeben werden, der Funktionsausdruck wird dadurch jedoch nicht zu einer Funktionsdeklaration. Der Name eines benannten Funktionsausdrucks gelangt nicht in den Namespace und wird nicht hochgestuft.

f();//TypeError: f ist keine Funktion
foo();//ReferenceError: foo ist nicht definiert
var f = function foo(){console.log(typeof foo);};
f();//Funktion
foo();//ReferenceError: foo ist nicht definiert
Der Name eines benannten Funktionsausdrucks ist nur innerhalb des Funktionsumfangs gültig.

Schauen wir uns das folgende Beispiel an:

var myval = "my global var";
(function() {
 console.log(myval); // log "my global var"
})();

Nach dem Login kopieren

Der obige Code gibt natürlich „meine globale Variable“ aus, aber wenn wir den obigen Code wie folgt leicht ändern:

var myval = "my global var";
(function() {
 console.log(myval); // log "undefined"
 var myval = "my local var";
})();

Nach dem Login kopieren

Das Ausführungsergebnis ist, dass ein Undefiniertes ausgegeben wird. Der Grund für dieses Ergebnis ist, dass die Variablendeklaration hochgestuft wird. Der obige Code entspricht dem folgenden:

var myval = "my global var";
(function() {
 var myval;
 console.log(myval); // log "undefined"
 myval = "my local var";
})();

Nach dem Login kopieren

Nur ​​der Deklarationsteil der Variablen wird heraufgestuft und nicht sofort initialisiert, sodass undefiniert ausgegeben wird.

Dieser Promotion-Mechanismus spiegelt sich jedoch nicht nur in gewöhnlichen Variablen wider, sondern auch in Funktionen. Beispielsweise kann der folgende Code nicht korrekt ausgeführt werden:

(function() {
 fun(); // Uncaught TypeError: undefined is not a function
 var fun = function() {
 console.log("Hello!");
 }
})();

Nach dem Login kopieren

Weil es äquivalent ist zu:

(function() {
 var fun;
 fun(); // Uncaught TypeError: undefined is not a function
 fun = function() {
 console.log("Hello!");
 }
})();

Nach dem Login kopieren

Da auch die Deklaration der Funktion gehisst und nicht sofort initialisiert wird, tritt ein Fehler auf.

Natürlich wird diese Art der Definition einer Funktion als „Funktionsausdruck“ bezeichnet und es gibt einen Heraufstufungsmechanismus. Wenn es sich um die folgende „Funktionsdeklarations“-Methode handelt, gibt es überhaupt keine Probleme mit dem Heraufstufungsmechanismus:

(function() {
 fun();
 function fun() {
 console.log("Hello!"); // log "Hello!"
 }
})();

Nach dem Login kopieren

Dies ist auch der Hauptunterschied zwischen Funktionsdeklaration und Funktionsausdruck.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage