Unterschied zwischen var und let in JavaScript

Unterschied zwischen var und let in JavaScript

Vorwort:

var ist ein Schlüsselwort für die Variablendeklaration, das seit dem ersten Erscheinen JavaScript existiert, während let ein Schlüsselwort für die Variablendeklaration ist, das erst in ES6 auftauchte. Es gibt zweifellos einen großen Unterschied zwischen den beiden. Was sind also die konkreten Unterschiede?

1. Bereiche werden in verschiedenen Formen ausgedrückt

var ist Funktionsumfang, let ist Blockumfang

{
  var Affe = "Xun Wukong";
  let pig='Schweinekotelett-Abdeckung';    
}
console.log(monkey); //Ausgabe undefiniert
console.log(pig); //Fehler: Pig ist nicht definiert


Wie aus dem obigen Code ersichtlich ist, sind mit let deklarierte Variablen nur in dem Codeblock gültig, in dem sie sich befinden, und außerhalb des Codeblocks ungültig und nicht zugänglich, während mit var deklarierte Variablen im Funktionsbereich gültig sind, in dem sich der Codeblock befindet.

2. Der Unterschied zwischen variabler Promotion und Nicht-Promotion

Mit var deklarierte Variablen werden angehoben, mit let deklarierte Variablen werden jedoch nicht angehoben.

console.log(Affe); //undefiniert
var Affe = "Xun Wukong";

console.log(pig); //Fehler: Pig ist nicht definiert
let pig='Schweinekotelett-Abdeckung'; 


Warum wird nach derselben Logik eine mit var deklarierte Variable als undefiniert angezeigt, wenn sie vor ihrer Deklaration aufgerufen wird, während eine mit let deklarierte Variable eine Ausnahme auslöst, wenn sie vor ihrer Deklaration aufgerufen wird? Dies ist der Unterschied zwischen den beiden bei der Variablenpromotion. Mit var deklarierte Variablen haben eine Variablenpromotion, während dies bei mit let deklarierten Variablen nicht der Fall ist.

Was ist also variable Promotion? Ich werde hier keine konzeptionelle Beschreibung geben. Ich werde nur mein persönliches Verständnis davon äußern, dass der obige Code tatsächlich dem Folgenden entspricht:

var Affe;

console.log(Affe); //undefiniert
Affe = „Xun Wukong“;

console.log(pig); //Fehler: Pig ist nicht definiert
let pig='Schweinekotelett-Abdeckung'; 

Sehen Sie den Unterschied? Die mit var deklarierte Variable wird zur Definition an den Anfang des Gültigkeitsbereichs extrahiert, aber es wird kein Wert zugewiesen. Die Zuweisungsoperation befindet sich noch in Ihrem Code. Wenn Sie also die mit var deklarierte Variable aufrufen, handelt es sich um eine Variable, die deklariert, aber nicht definiert wurde. Das Ergebnis des Aufrufs ist also undefined . Dies ist die sogenannte Variablenpromotion. Für durch let definierte Variablen gibt es jedoch keine solche Variablenförderung.

3. Unterschiede bei temporären toten Zonen

Temporäre Totzone: Wenn eine Variable in einen Bereich aufgenommen wird und es im äußeren Bereich eine Variable mit demselben Namen gibt, hat dies keine Auswirkungen auf den äußeren Bereich, selbst wenn die Variable im Bereich geändert wird.

Die spezifischen Leistungen sind wie folgt:

für(var i=0;i<5;i++){
    setzeTimeout(Funktion(){
        Konsole.log(i)
    },1000)
}
für (lass i = 0; i < 5; i++) {
  setzeTimeout(Funktion(){
     Konsole.log(i)          
  },1000)  
}


Was sind die Ergebnisse der Ausführung dieser beiden Codes?

Das Ergebnis des ersten Codes ist, dass nach 1 Sekunde 5 5er nacheinander gedruckt werden. Das Ergebnis des zweiten Codes ist, dass nach 1 Sekunde 0, 1, 2, 3, 4 nacheinander gedruckt werden.

Warum besteht dieser Unterschied?

Da die Variable i im ersten Code durch das Schlüsselwort var deklariert wird, gibt es keine kritische Totzone, d. h. die Variable i, auf die Sie in setTimeout nach 1 Sekunde zugreifen, ist das i, nachdem die for-Schleife im globalen Kontext beendet ist, sodass die gedruckten Ergebnisse alle 5 sind;

Die Variable i im zweiten Code wird durch das Schlüsselwort let deklariert, wodurch eine kritische Totzone entsteht. Die Variable i in setTimeout ist der Wert von i, als Sie sie zu diesem Zeitpunkt gespeichert haben. Das i in diesem Speicherintervall wird sich nicht ändern, da es außerhalb dieselbe Variable i gibt und ihr ein anderer Wert zugewiesen ist. Es ist immer noch der zuvor gespeicherte Wert. Dies ist die Manifestation einer temporären Totzone und auch der Grund, warum der zweite Code nach der Ausführung nacheinander 0, 1, 2, 3, 4 ausgibt.

4. Im selben Kontext kann var wiederholt deklariert werden, let jedoch nicht

lass monkey='Xun Wukong';
let monkey = '逼马吻'; //Fehler: Bezeichner 'a' wurde bereits deklariert
var pig = 'Schweinekotelett-Abdeckung';
var pig = 'pig anal fissure'; //Normaler Zugriff, der Wert der Variable pig wird ersetzt

Dies ist das Ende dieses Artikels über den Unterschied zwischen var und let in JavaScript. Weitere Informationen zu var und let in JavaScript finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren:
  • Was sind die Unterschiede zwischen var let const in JavaScript
  • Detaillierte Erklärung der Unterschiede zwischen var, let und const in JavaScript es6
  • Detaillierte Erklärung der Unterschiede und Verwendung von var in JavaScript und let und const in ES6-Spezifikationen
  • Verstehen Sie den Unterschied zwischen den Schlüsselwörtern let, var und const in JavaScript
  • Detaillierte Erklärung des Unterschieds zwischen let- und var-Deklarationsvariablen in js
  • Eine kurze Analyse der Unterschiede zwischen var, let und const in JavaScript

<<:  So finden und löschen Sie doppelte Zeilen in MySQL

>>:  Beispielcode zum Zeichnen von Doppelpfeilen in gängigen CSS-Stilen

Artikel empfehlen

Lernen Sie die asynchrone Programmierung in Node.js in einem Artikel

Inhaltsverzeichnis Einführung Synchron Asynchron ...

Spezifische Verwendung des Linux-Befehls „dirname“

01. Befehlsübersicht dirname - entfernt nicht zu ...

Verwenden von Schleifen in awk

Lernen wir verschiedene Arten von Schleifen kenne...

Block- und Zeilenelemente, Sonderzeichen und Verschachtelungsregeln in HTML

Wenn wir die Verschachtelungsregeln grundlegender...

Detaillierte Erklärung der Verwendung des MySQL-Paradigmas

1. Paradigma Der englische Name des Paradigmas la...

Was ist dies in einer Punkt-für-Punkt-Reihe von JavaScript?

Verstehe das Vielleicht haben Sie this in anderen...

Confluence mit Docker bereitstellen

1. Umweltanforderungen 1. Docker 17 und höher wur...

Implementierungsprozessdatensatz für benutzerdefinierte Vue-Tabellenspalten

Inhaltsverzeichnis Vorwort Rendern setTable-Kompo...

Beispielmethode zum Anzeigen der mit MySQL verbundenen IP-Adresse

Spezifische Methode: Öffnen Sie zuerst die Eingab...

So ändern Sie das Root-Passwort von Mysql5.7.10 auf dem MAC

Starten Sie MySQL zunächst im Skip-Grant-Tables-M...