Problem mit der Identifikator-Promotion in JavaScript_Javascript-Tipps

JS hat eine variable Förderung. Dieses Design ist tatsächlich schlecht, oder es ist ein Nebeneffekt der Sprachimplementierung. Es ermöglicht den Zugriff auf Variablen ohne Deklaration oder die spätere Deklaration und erste Verwendung. Neulinge sind dadurch verwirrt, und selbst viele Veteranen, die JS seit vielen Jahren verwenden, sind verwirrt. Aber nachdem ES6 let/const hinzugefügt hat, existiert die Variable Hoisting nicht mehr.

1. Die Variable ist nicht deklariert, verwenden Sie sie direkt

function test() {
  alert(notDefined);
}
test(); // ?

Es ist selbstverständlich, Fehler zu melden

2. Variablendeklaration am Ende

function test() {
  alert(declaredButNotAssigned); // undefined
  var declaredButNotAssigned;
}
test();

Ausgabe undefiniert, das Ergebnis ist im Vergleich zum obigen Beispiel verbessert, es wird kein Fehler gemeldet, der Code kann ausgeführt werden, aber der Variablenwert entspricht möglicherweise nicht den Erwartungen des Programmierers.

3. Deklarieren Sie die Variable am Ende und weisen Sie der Variablen gleichzeitig einen Wert zu

function test() {
  alert(declaredAndAssigned); // undefined
  var declaredAndAssigned = 1;
}
test();

Das Ergebnis ist das gleiche wie bei zwei. Offensichtlich wird 1 nicht nur aufgrund der Zuweisung ausgegeben.

Sowohl zwei als auch drei verfügen über ein variables Heben (Hoisting), einfach definiert

Variablenheraufstufung: Im angegebenen Bereich werden Variablen in Bezug auf die Codereihenfolge zuerst verwendet und dann deklariert, aber die „Zugänglichkeit“ der Variablen zur Laufzeit wird an die Spitze des aktuellen Bereichs heraufgestuft und ihr Wert ist undefiniert , und es gibt keine „Verfügbarkeit“ „.

Der Schwerpunkt liegt hier auf „Codereihenfolge“ und „Laufreihenfolge“, da der von uns geschriebene Code die meiste Zeit nacheinander ausgeführt wird, d. h. „Codereihenfolge“ und „Laufreihenfolge“ sind konsistent. Dies steht auch im Einklang mit dem Denkprozess des menschlichen Gehirns. Zum Beispiel Programmierer mit Erfahrung in der C-Sprache

#include <stdio.h>
int main() {
  int x = 1;
  printf("%d, ", x); // 1
}

Zwei Codezeilen: Deklarieren Sie zuerst den Ganzzahltyp x und geben Sie ihn dann aus. Die Codesequenz und die Laufsequenz sind konsistent, dh normaler Betrieb.

Wenn die Reihenfolge umgekehrt ist

#include <stdio.h>
int main() {
  printf("%d, ", x); // error
  int x = 1;
}

Zu diesem Zeitpunkt kann die Kompilierung nicht abgeschlossen werden. Aber es kann in JS umgekehrt geschrieben werden, siehe 2 und 3.

Daher wissen Programmierer mit Erfahrung in C-ähnlichen Sprachen, dass Variablen zuerst deklariert und dann verwendet werden müssen, andernfalls wird ein Fehler gemeldet. In JS gibt es ein Phänomen der Variablenförderung, das zuerst verwendet und dann deklariert werden kann. Die Erfahrung von C wird in JS verwendet, was zu Verwirrung führt.

4. Funktionsausdrücke haben auch Variablenförderung

function test() {
  alert(func); // undefined
  var func = function() {};
}
test();

Aber wenn Sie diese Funktion nutzen möchten, ist das nicht möglich

function test() {
  alert(func); // undefined
  func(); // 报异常
  var func = function() {};
}
test();

Die Ergebnisfunktion ist undefiniert und der Aufruf von func meldet eine Ausnahme. Zugänglichkeit und Verfügbarkeit sind in der obigen Definition erwähnt und entsprechen den folgenden Aussagen.

Zugänglichkeit: Alert(func), Ausgabe undefiniert, kann ausgeführt werden, auf func kann zugegriffen werden.

Verfügbarkeit: func() meldet eine Ausnahme und func kann nicht normal aufgerufen werden, was auf keine Verfügbarkeit hinweist.

Zweites, drittes und viertes sind alles Variablen, die mit var deklariert werden. Funktionsdeklarationen in JS werden ebenfalls verbessert, aber diese „Variable“ ist ein Funktionstyp (kann als Funktion, Methode oder Konstruktor verwendet werden). . Sein Name (Bezeichner) wird ebenfalls an die Spitze des aktuellen Geltungsbereichs gehoben.

5. Der Name der Funktionsdeklaration wird ebenfalls an die Spitze des aktuellen Bereichs verschoben

function test() {
  alert(f1); // function
  f1(); // "called"
  function f1() {
    alert('called');
  }
}
test();

Wir sehen, dass f1 am Ende des Codes deklariert wird und f1 zuerst verwendet wird. Sowohl Alert(f1) als auch f1() werden normal ausgeführt, was darauf hinweist, dass sowohl Zugänglichkeit als auch Benutzerfreundlichkeit vorhanden sind.

Wie bereits erwähnt, nützt das variable Heben nichts. Es ist eine schlechte Angewohnheit, „zuerst zu deklarieren und dann zu verwenden“. Diese Funktion wird auch in vielen Interviewfragen großer Unternehmen vorkommen

Frage 1:

// 写出以下代码的运行结果
var a = 1;
function fn() {
  if (!a) {
    var a = 2;
  }
  alert(a); // ?
}
fn();

Frage 2:

// 写出以下代码的运行结果
var a = 1;
function fn() {
  a = 2;
  return;
  function a() {}
}
fn();
alert(a); // ?

Aber das alles endete mit der Einführung von let/const in ES6, bis auf globale Variablen verwendet alles andere in ES let/const. Nach dem Ersetzen von var durch let gibt es keine Variablenförderung mehr.

function test() {
  alert(declaredButNotAssigned1); // 报异常
  alert(declaredButNotAssigned2); // 报异常
  alert(func); // 报异常
 
  let declaredButNotAssigned1;
  let declaredButNotAssigned2 = true;
  let func = function() {};
}
test();

Dies zwingt Programmierer dazu, gute Gewohnheiten zu entwickeln. Variablen müssen „zuerst deklariert und dann verwendet werden“, andernfalls wird ein Fehler gemeldet.

Das Folgende ist ein Auszug aus der MDN-Beschreibung der Variablenförderung, wenn let nicht auftritt

Code kopieren Der Code lautet wie folgt:

In ECMAScript 6 hebt let die Variable nicht an den Anfang des Blocks. Wenn Sie auf eine Variable in einem Block verweisen, bevor die let-Deklaration für diese Variable gefunden wird, führt dies zu einem ReferenceError, da sich die Variable in einem „temporal dead“ befindet Zone“ vom Beginn des Blocks bis zur Verarbeitung der Deklaration.

Nach der Verwendung von let zum Deklarieren von Variablen ist typeof nicht mehr sicher

if (condition) {
  alert(typeof num); // Error!
  let num = 100;
}
 

In der Vergangenheit konnten Sie typeof == 'undefiniert' verwenden, um festzustellen, ob eine bestimmte Bibliothek eingeführt wurde, wie z. B. jQuery

// 判断jQuery是否引入了
if (typeof $ !== 'undefined') {
  // do something
}...

jQuery wird nicht eingeführt und $ wird nicht deklariert. Dieser Satz meldet keinen Fehler und wirkt sich nicht auf die Ausführung des folgenden Codes aus. Wenn er jedoch mit let deklariert wird, wird ein Fehler gemeldet.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.