let und const sind neue Funktionen, die von ECMAScript6 eingeführt wurden. let ist ein "Standard", der var ersetzen kann. Daher diskutieren wir den Unterschied zwischen var, let und const. Zunächst sollten wir wissen, was in var nicht standardisiert ist oder welche Nachteile bestehen .
Eigenschaften von var
Variable Werbung
var ist ein Schlüsselwort, das von Javascript zum Definieren von Variablen verwendet wird. Dies ist eine einfache Methode zur Variablendefinition
var a = 0;
Wenn wir dies jedoch vor dem Definieren dieser Variablen abfragen, werden wir keinen Fehler melden
console.log(a); // undefined
var a = 0;
console.log(a); // 0
Obwohl es undefiniert ausgibt, ist dies nicht das, was wir wollen. Wir hoffen, dass auf die Variable nicht zugegriffen werden kann, bevor die Variable initialisiert wird. Obwohl dies eine Einschränkung ist, kann es Ihr Programm schwer fassbarer und wartbarer machen. Die var ist es gelungen, var a = 0;vor zugegriffen werden, weil dieser Satz bei der Kompilierung in der folgenden Reihenfolge tatsächlich durchgeführt:
var a;
console.log(a); // undefined
a = 0;
console.log(a); // 0
Aus diesem Grund wird die zweite Zeile a undefiniert gedruckt. Dies wird als Variablenheraufstufung bezeichnet. Wenn Sie var verwenden, um eine Variable zu initialisieren, wird die Variable am Anfang des Bereichs zuerst definiert und später zugewiesen (initialisiert). So können auch Sie so spielen:
console.log(a); // undefined
a = 0;
console.log(a); // 0
var a;
Dies kann auch erfolgreich gedruckt werden, sodass jeder verstehen sollte, dass var die Wartung der Augen des Programms stört. a Was ich offensichtlich nicht gesehen habe, nachdem ich den ganzen Weg nach unten geschaut habe, wird es immer noch normal verwendet? ! ! Zu diesem Zeitpunkt müssen Sie überprüfen, ob der Bereich var a;außerhalb des Bereichs verborgen ist. Wenn nicht, müssen Sie außerhalb des Bereichs schauen.
console.log(a); // undefined
let a = 0;
console.log(a); // 0
var scope
Schauen wir uns noch einmal den folgenden Code an
for(var i = 0; i < 5; i++){
var a = 0;
}
console.log(i); // 5
console.log(a); // 0
Die Variablen i und a, die wir im for-Schleifenblock definiert haben, können außerhalb der Schleife genommen werden, was offensichtlich nicht standardisiert ist.
Dann können Sie hier eine andere Frage stellen, die im Interview oft erwähnt wird
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i); // 5 5 5 5 5
}, 300);
}
for (let j = 0; j < 5; j++) {
setTimeout(function () {
console.log(j); // 0 1 2 3 4
}, 300);
}
Der Code ist fast der gleiche, da die Ergebnisse unterschiedlich sind und die erzielten Ergebnisse sehr unterschiedlich sind. Für die erste for-Schleife ist i im globalen Bereich gültig, und die Definition von i ist in der Funktion setTimeout nicht enthalten, sodass die Variable i global gefunden werden kann. Nachdem die for-Schleife ausgeführt wurde, in der Ereignisschleife in setTimeout Die anonyme Funktion wird ausgeführt. Zu diesem Zeitpunkt ist das globale i tatsächlich bereits 5, sodass alle 5 ausdrucken.
Für die zweite for-Schleife hat let das Konzept des Bereichs auf Blockebene, und es ist erwähnenswert, dass die let-Anweisung am Kopf der for-Schleife ein spezielles Verhalten aufweist. Dieses Verhalten gibt an, dass die Variable während der Schleife mehr als einmal deklariert wird. Jede Iteration wird deklariert. Bei jeder nachfolgenden Iteration wird die Variable mit dem Wert am Ende der vorherigen Iteration initialisiert. Dies macht unser j, jede Ausführung ist tatsächlich eine andere Variable im Blockbereich, natürlich ist es nicht die letzte 5.
Wenn Sie E6 nicht verwenden können, können Sie mithilfe von Verschlüssen einen neuen Bereich erstellen. Dieser Abschluss kann einen Verweis auf den Bereich behalten, in dem er deklariert ist, und i dazu zwingen, im Bereich der selbstausführenden Funktion zu bleiben, damit er nicht recycelt wird. Auf diese Weise kann jedes Mal ein i-Wert erhalten werden.
for (var i = 0; i < 5; i++) {
(function (i) {
setTimeout(function () {
console.log(i) // 0 1 2 3 4
}, 300)
})(i)
}
var kann wiederholt definiert werden
Dies ist leicht zu verstehen. Var darf zweimal definiert werden, ohne Fehler zu melden.
var a = 0;
console.log(a); // 0
var a = 1;
console.log(a); // 1
Der Editor ignoriert das Schlüsselwort var, wenn er beurteilt, dass bereits deklarierte Variablen mit demselben Namen vorhanden sind, und weist dann direkt einen Wert zu. Wenn also eine wiederholte Anweisung einen Anfangswert hat, handelt es sich um eine Zuweisungsanweisung. Wenn eine wiederverwendete Anweisung keinen Anfangswert hat, hat dies keine Auswirkungen auf die ursprünglich vorhandenen Variablen. Dies ist für JS vor ES5 zulässig, aber nach ES6 wird es als unwissenschaftlich angesehen, diese Definition zu wiederholen. Let und const erlauben nicht, dass eine Variable mit demselben Namen im Bereich wiederholt wird.
Lassen Sie uns jetzt über let sprechen
Temporäre Totzone
Erstens ist es absolut nicht erlaubt, diese Variable zu verwenden, bevor let die Variable definiert
console.log(a); // ReferenceError: a is not defined
let a = 0;
console.log(a); // 0
Die let-Anweisung wird nicht an die Spitze des aktuellen Ausführungskontexts heraufgestuft. Vom Bereich auf Blockebene bis zur Initialisierungsposition wird sie als "temporäre Totzone" bezeichnet. Wenn Sie also a in der temporären Totzone für a verwenden, wird ein Referenzfehler gemeldet . .
Bereich blockieren
Die von let deklarierte Variable hat einen Bereich auf Blockebene, und auf die Variable kann außerhalb des Bereichs auf Blockebene nicht zugegriffen werden, und var ist unterschiedlich. Auf die in der for-Schleife definierten Variablen kann extern zugegriffen werden, was zu unerwarteten Fehlern führen kann. Beachten Sie, dass die geschweiften Klammern {} einen Bereich auf Blockebene haben, ganz zu schweigen vom Funktionsbereich.
Keine Neudefinition
let a = 0;
console.log(a); // 0
let a = 1;
console.log(a); // SyntaxError: Identifier 'a' has already been declared
Fensterobjekt
In HTML bezieht sich der globale Bereich auf das Fensterobjekt. Die durch das Schlüsselwort var definierte globale Bereichsvariable gehört zum Fensterobjekt, während let nicht definiert. Beachten Sie, dass dies in einer Browserumgebung der Fall ist. Wenn es sich um einen Knoten handelt, gibt es kein Fensterobjekt.
var a = 0;
console.log(window.a) // 0
let b = 1;
console.log(window.b) // undefined
const
Tatsächlich ist const sehr sehr ähnlich zu let. Let hat die gleichen Eigenschaften wie let und const hat es. Der Unterschied besteht darin, dass erstens const keine "Modifikation" von Variablen zulässt. Zweitens muss const initialisiert werden und let muss nicht.
const a = 0;
a = 1; // TypeError: Assignment to constant variable
const b; // SyntaxError: Missing initializer in const declaration
Was const definiert, ist jedoch keine Konstante im eigentlichen Sinne. Wenn Sie ein Objekt oder ein Array definieren, kann es tatsächlich geändert werden, aber Sie können ihm keine anderen Datentypen zuweisen. Im Allgemeinen können Sie sich daran erinnern: Nachdem const initialisiert wurde, können Sie = nicht verwenden Zuordnung.
const a = {}
a.b = 1;
console.log(a) // { b: 1 }
a = 1 // TypeError: Assignment to constant variable