Das Schlüsselwort let
deklariert eine Variable im Gültigkeitsbereich des lokalen Blocks. Optional wird die Variable mit einem Wert initialisiert. let leitet sich vom englischen Verb "to let" ab, so daß man die Zeile "let x = 3" lesen kann als: "lassen wir x 3 sein" (let x be three), bekannt aus der Programmiersprache BASIC.
Syntax
let var1 [= wert1] [, var2 [= wert2]] [, ..., varN [= wertN]];
Parameter
var1
,var2
, …,varN
- Variablenname. Jeder legale Bezeichner ist erlaubt.
wert1
,wert2
, …,wertN
- Initialwerte der Variablen. Jeder legale Ausdruck ist erlaubt.
Beschreibung
let
ermöglicht es Variablen zu deklarieren, deren Gültigkeitsbereich auf den Block, den Befehl oder den Ausdruck beschränkt ist, in dem sie deklariert sind. Der Unterschied zum var
Schlüsselwort ist, dass der Gültigkeitsbereich auf Blöcke und nicht auf Funktionen bzw. Global beschränkt ist.
Regeln für Gültigkeitsbereiche
Variablen, die mit let
deklariert werden, haben als Gültigkeitsbereich den Block in dem sie definiert wurden und alle weiteren Unterblöcke in denen sie nicht neu definiert werden. In dieser Hinsicht funktioniert let
ähnlich wie var
. Der Unterschied besteht darin, dass der Gültigkeitbereich bei var
Deklarierten Variablen die umschließende Funktion ist:
function varTest() {
var x = 31;
if (true) {
var x = 71; // gleiche Variable!
console.log(x); // 71
}
console.log(x); // 71
}
function letTest() {
let x = 31;
if (true) {
let x = 71; // andere variable
console.log(x); // 71
}
console.log(x); // 31
}
Auf der ersten Ebene von Programmen und Funktionen erzeugt let
im globalen Objekt keine Property, var
hingegen schon. Deshalb ist this.y
im folgenden Beispiel undefined
.
var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // undefined
Private Eigenschaften emulieren
Beim Einsatz von Konstruktoren können let
-Deklarationen (alternativ zu Closures) genutzt werden, um private Eigenschaften in mehreren Methoden zu verwenden.
var Thing;
{
let privateScope = new WeakMap();
let counter = 0;
Thing = function() {
this.someProperty = 'foo';
privateScope.set(this, {
hidden: ++counter,
});
};
Thing.prototype.showPublic = function() {
return this.someProperty;
};
Thing.prototype.showPrivate = function() {
return privateScope.get(this).hidden;
};
}
console.log(typeof privateScope);
// "undefined"
var thing = new Thing();
console.log(thing);
// Thing {someProperty: "foo"}
thing.showPublic();
// "foo"
thing.showPrivate();
// 1
Das selbe Kapselungsmuster mit Funktionsabschlüssen über lokale Variablen kann mit var
erstellt werden, aber dieses benötigt dann funktionsweite Sichtbarkeit (üblicherweise eine IIFE im Modulmuster) anstatt nur blockweite Sichtbarkeit wie das obenstehende Beispiel.
Redeklarationen
Erneute Deklaration derselben Variable innerhalb desselben Gültigkeitsbereiches erzeugt einen Syntaxfehler (SyntaxError
).
if (x) {
let foo;
let foo; // SyntaxError thrown.
}
Der Körper einer switch
-Anweisung ist nur ein einzelner Block, weshalb das folgende Beispiel einen Fehler verursacht.
let x = 1;
switch(x) {
case 0:
let foo;
break;
case 1:
let foo; // SyntaxError for redeclaration.
break;
}
Ist innerhalb einer case-Klausel jedoch ein innerer Block eingebettet, erzeugt dieser seinen eigenen lexikalischen Gültigkeitsbereich. Das folgende Beispiel erzeugt deshalb keine solchen Redeklarations-Fehler, wie sie im vorangegangenen Beispiel auftraten.
let x = 1;
switch(x) {
case 0: {
let foo;
break;
}
case 1: {
let foo;
break;
}
}
Sauberer Quelltext in inneren Funktionen
let
macht den Programmcode manchmal leserlicher, wenn innere Funktionen eingesetzt werden.
var list = document.getElementById("list");
for (var i = 1; i <= 5; i++) {
var item = document.createElement("li");
item.appendChild(document.createTextNode("Item " + i));
let j = i;
item.onclick = function (ev) {
console.log("Item " + j + " is clicked.");
};
list.appendChild(item);
}
Dieses Beispiel funktioniert wie erwartet, weil alle fünf Instanzen der anonymen inneren Funktionen auf verschiedene Instanzen der Variable j
zugreifen. Wenn stattdessen var
verwendet wird oder in der inneren Funktion statt j
zu deklarieren i
benutzt wird, funktioniert dies nicht.
Zeitweilig tote Zonen und Fehler mit let
In ECMAScript 2015, werden Deklarationen mit let
nicht an den Anfang des Blocks verschoben (hoist). Wird eine Variable vor der Deklaration in einem Block referenziert, führt dies zu einem ReferenceError
, weil sich die Variable bei Eintritt in den Block bis zur Verarbeitung der Deklaration in einer "zeitweilig toten Zone" (temporal dead zone) befindet.
function do_something() {
console.log(foo); // ReferenceError
let foo = 2;
}
Ein switch
Block besteht nur aus einem Block, so dass Fehler wie im folgenden Beispiel auftreten können.
switch (x) {
case 0:
let foo;
break;
case 1:
let foo; // SyntaxError für erneute Deklaration
break;
}
Ein weiteres Beispiel zeitweilig toter Zonen mit lexikalischen Gültigkeitsbereichen
Aufgrund seines lexikalischen Gültigkeitsbereiches wird der Bezeichner "foo" im untenstehenden Ausdruck (foo + 55)
als das foo des if-Blocks interpretiert, nicht aber als die verdeckte Variable foo mit dem Wert 33.
Bei Auswertung des Ausdrucks existiert das foo des if-Blocks bereits im lexikalischen Gültigkeitsbereich, hat seine Initialisierung (welche Teil derselben Anweisung ist) aber noch nicht erreicht (und auch nicht abgeschlossen). Folglich ist es noch immer in seiner zeitweilig toten Zone.
function test(){
var foo = 33;
if (true) {
let foo = (foo + 55); // ReferenceError
}
}
test();
Dieses Phänomen kann in einer Situation wie der folgenden verwirren. Die Anweisung let n of n.a
gehört bereits zum eigenen Gültigkeitsbereich des Blocks der for-Schleife. Der Bezeichner "n.a" wird als Eigenschaft 'a' des Objektes 'n' interpretiert, welches im ersten Teil derselben Anweisung deklariert wird ("let n"). Dieses befindet sich noch immer in seiner zeitweilig toten Zone, da bei Auswertung des Ausdrucks die Deklarationsanweisung als noch nicht erreicht und abgeschlossen gilt.
function go(n) {
// n here is defined!
console.log(n); // Object {a: [1,2,3]}
for (let n of n.a) { // ReferenceError
console.log(n);
}
}
go({a: [1, 2, 3]});
Nicht-standardisierte let
Ausdrücke
let
Blöcke
Die Unterstützung für let
Blöcke wurde in Gecko 44 entfernt (Bug 1167029).
let
Blöcke ermöglichen es Werte von Variablen in einem Block zu bearbeiten, ohne gleichnamige Variablen außerhalb des Blocks zu beeinflussen.
Syntax
let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) block;
Beschreibung
Der let
Block unterstützt lokales Scoping für Variablen. Es funktioniert mit dem Binden von keiner oder mehreren Variablen im lexikalischen Scope eines einzigen Blocks. Ansonsten ist es genau das selbe wie ein Block Statement. Zu beachten ist, dass Variablen, die innerhalb des let
Blocks mit var
definiert werden auch außerhalb des Blocks verfügbar sind, weil diese an die Funktion gebunden werden. Wenn ein let
Block-Syntax benutzt wird, ist das let
gefolgt von runden Klammern zwingend notwendig. Fehler beim benutzen führen zu einem Syntaxerror.
Beispiel
var x = 5;
var y = 0;
let (x = x+10, y = 12) {
console.log(x+y); // 27
}
console.log(x + y); // 5
Die Regeln für den Codeblock sind die gleichen wie für alle anderen Blöcke in JavaScript. Er hat seine Eigenen lokalen Variablen, die mit let
deklariert sind.
Regeln für Gültigkeitsbereiche
Die Sichtbarkeit von mit let
definierten Variablen ist der let
Block selbst und auch jeder weitere innere Block in diesem Block, wenn die inneren Blöcke keine Variablen mit dem gleichen Namen definieren.
let
Ausdrücke
Die Unterstützung für let
Blöcke wurde in Gecko 41 entfernt (Bug 1023609).
Der let
Ausdruck setzt die Sichtbarkeit einer Variablen auf nur einen Ausdruck.
Syntax
let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) expression;
Beispiel
Man kann let
benutzen, um Variablen nur für einen Ausdruck zu benutzen:
var a = 5;
let(a = 6) console.log(a); // 6
console.log(a); // 5
Regeln für Gültigkeitsbereiche
Gegeben ist folgender let
Ausdruck:
let (decls) expr
Es wird ein impliziter Block um expr erstellt.
Name
Die Erklärung, daß let von englisch "to let sth. be sth." abgeleitet ist und so "let" als Name (reserviertes Wort) ausgewählt wurde, ist hier (englisch) zu finden.
Spezifikationen
Spezifikation | Status | Kommentar |
---|---|---|
ECMAScript 2015 (6th Edition, ECMA-262) Die Definition von 'Let and Const Declarations' in dieser Spezifikation. |
Standard | Initiale Definition. Definiert keine let Ausdrücke und let Blöcke. |
ECMAScript (ECMA-262) Die Definition von 'Let and Const Declarations' in dieser Spezifikation. |
Lebender Standard |
Browserkompatibilität
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 41.0 | 12 | 44 (44) | 11 | 17 | ? |
Temporal dead zone | ? | 12 | 35 (35) | 11 | ? | ? |
let expression |
Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
let block |
Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
Allowed in sloppy mode | 49.0 | ? | 44 (44) | ? | ? | ? |
Feature | Android | Android Webview | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|
Basic support | ? | 41.0 | 44.0 (44) | ? | ? | ? | 41.0 |
Temporal dead zone | ? | ? | 35.0 (35) | ? | ? | ? | ? |
let expression |
Nicht unterstützt | ? | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
let block |
Nicht unterstützt | ? | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
Allowed in sloppy mode | Nicht unterstützt | 49.0 | 44 (44) | ? | ? | ? | 49.0 |
Firefox-spezifische Hinweise
- Vor SpiderMonkey 46 (Firefox 46 / Thunderbird 46 / SeaMonkey 2.43), wurde ein
TypeError
statt einemSyntaxError
erzeugt, wenn Neudeklarationen durchgeführt wurden (Bug 1198833, Bug 1275240). - Vor SpiderMonkey 44 (Firefox 44 / Thunderbird 44 / SeaMonkey 2.41), war
let
nur in Quelltexten verfügbar, die im HTML durch ein<script type="application/javascript;version=1.7">
Block umfasst wurden (oder höhere Versionen) und hatte eine andere Semantik. - Die Unterstützung in
Worker
Codes ist hinter demdom.workers.latestJSVersion
flag versteckt (Bug 487070). Mit versionsfreiemlet
, wird das Flag für diese Funktion entfernt (Bug 1219523). - ES2015-Einhaltung für
let
für SpIderMonkey wird in Bug 950547 nachverfolgt.