Let JavaScript

ECMAScript 2015

ECMAScript 2015 führte zwei wichtige neue JavaScript-Schlüsselwörter ein:let et const.

Diese beiden Schlüsselwörter bieten in JavaScript Blockbereiche (Block Scope) Variablen (und Konstanten).

Vor ES2015 hatte JavaScript nur zwei Arten von Bereichen:Portée globaleetPortée de la fonction.

Portée globale

GlobalVariablen, die außen (außerhalb der Funktion) deklariert werden, habenPortée globale.

Exemple

var carName = "porsche";
// Hier kann carName verwendet werden
function myFunction() {
  // Hier kann carName verwendet werden
}

Essayez-le vous-même

GlobalVariablen können von jedem Ort im JavaScript-Programm erreicht werden.

Portée de la fonction

LokalVariablen, die innen (im Funktionsbereich) deklariert werden, habenPortée de la fonction.

Exemple

// Hier kann carName nicht verwendet werden
function myFunction() {
  var carName = "porsche";
  // code hier CAN use carName
}
// Hier kann carName nicht verwendet werden

Essayez-le vous-même

LokalVariablen können nur im Funktionsbereich, in dem sie deklariert werden, erreicht werden.

JavaScript Blockbereich

par var Variablen, die durch Schlüsselwörter deklariert werden, haben keine BlockBereich.

In einem Block {} Variablen, die innen deklariert werden, sind von außen zugänglich.

Exemple

{ 
  var x = 10; 
}
// Hier kann x verwendet werden

Vor ES2015 hatte JavaScript keine Blockbereiche.

Kann verwendet werden let Schlüsselwortdeklarationen besitzen Blockbereiche.

In einem Block {} Variablen, die innen deklariert werden, sind von außen nicht zugänglich:

Exemple

{ 
  let x = 10;
}
// Hier kann x nicht verwendet werden

Wiedererneuerung der Variablen

Verwendung var Das Schlüsselwort zur Wiedererneuerung der Variablen kann Probleme verursachen.

Die Wiedererneuerung der Variablen in einem Block wird auch die Wiedererneuerung der Variablen außerhalb des Blocks wiederholen:

Exemple

var x = 10;
// Hier x ist 10
{ 
  var x = 6;
  // Hier x ist 6
}
// Hier x ist 6

Essayez-le vous-même

Verwendung let Das Schlüsselwort zur Wiedererneuerung der Variablen löst dieses Problem.

Die Wiedererneuerung der Variablen in einem Block wird nicht die Wiedererneuerung der Variablen außerhalb des Blocks wiederholen:

Exemple

var x = 10;
// Hier x ist 10
{ 
  let x = 6;
  // Hier x ist 6
}
// Hier x ist 10

Essayez-le vous-même

Browservorlagen

Internet Explorer 11 oder frühere Versionen unterstützen den Browserversion nicht vollständig let Schlüsselwort.

Die nachstehende Tabelle definiert den ersten vollständig unterstützten let Browserversion des Schlüsselworts:

Chrome 49 IE / Edge 12 Firefox 44 Safari 11 Opera 36
Mars 2016 Juillet 2015 Janvier 2015 Septembre 2017 Mars 2016

Portée de la boucle

Utilisation dans la boucle var:

Exemple

var i = 7;
for (var i = 0; i < 10; i++) {
  // Certaines instructions
}
// Ici, i vaut 10

Essayez-le vous-même

Utilisation dans la boucle let:

Exemple

let i = 7;
for (let i = 0; i < 10; i++) {
  // Certaines instructions
}
// Ici, i vaut 7

Essayez-le vous-même

Dans le premier exemple, la variable utilisée dans la boucle utilise var Redéclaré la variable en dehors de la boucle.

Dans l'exemple suivant, la variable utilisée dans la boucle utilise let Ne pas redéclarer la variable en dehors de la boucle.

Si vous utilisez let Si vous avez déclaré la variable i, alors seule la variable i est visible à l'intérieur de la boucle.

Portée de la fonction

Lorsque vous déclarez une variable dans une fonction, utilisez var et let et sont très similaires.

Ils ont tousPortée de la fonction:

function myFunction() {
  var carName = "porsche";   // Portée de la fonction
}
function myFunction() {
  let carName = "porsche";   // Portée de la fonction
}

Portée globale

Si une déclaration est faite en dehors du bloc, alors var et let et sont très similaires.

Ils possèdent tousPortée globale:

var x = 10;       // Portée globale
let y = 6;       // Portée globale

Variables globales dans HTML

Dans le cas de JavaScript, l'ensemble global est l'environnement JavaScript.

Dans HTML, l'ensemble global est l'objet window.

par var Les variables globales définies par des mots-clés appartiennent à l'objet window :

Exemple

var carName = "porsche";
// Ce code peut utiliser window.carName

Essayez-le vous-même

par let Les variables globales définies par des mots-clés ne font pas partie de l'objet window :

Exemple

let carName = "porsche";
// Ce code ne peut pas utiliser window.carName

Essayez-le vous-même

Redéclaration

Autorisé en tout point du programme var Redéclaration de variable JavaScript :

Exemple

var x = 10;
// Maintenant, x vaut 10
var x = 6;
// Maintenant, x vaut 6

Essayez-le vous-même

dans le même scope, ou dans le même bloc, par let redéclarer une var Les variables ne sont pas autorisées :

Exemple

var x = 10;       // Autorisé
let x = 6;       // Interdit
{
  var x = 10;   // Autorisé
  let x = 6;   // Interdit
}

dans le même scope, ou dans le même bloc, par let redéclarer une let Les variables ne sont pas autorisées :

Exemple

let x = 10;       // Autorisé
let x = 6;       // Interdit
{
  let x = 10;   // Autorisé
  let x = 6;   // Interdit
}

dans le même scope, ou dans le même bloc, par var redéclarer une let Les variables ne sont pas autorisées :

Exemple

let x = 10;       // Autorisé
var x = 6;       // Interdit
{
  let x = 10;   // Autorisé
  var x = 6;   // Interdit
}

dans des scopes ou des blocs différents, par let Il est autorisé de redéclarer une variable :

Exemple

let x = 6;       // Autorisé
{
  let x = 7;   // Autorisé
}
{
  let x = 8;   // Autorisé
}

Essayez-le vous-même

Hoisting

par var Les variables déclaréesHoistingau sommet. Si vous ne comprenez pas ce qu'est le Hoisting, apprenez notre chapitre sur le Hoisting.

Vous pouvez utiliser la variable avant sa déclaration :

Exemple

// Ici, vous pouvez utiliser carName
var carName;

Essayez-le vous-même

par let Les variables définies ne sont pas levées vers le sommet.

dans la déclaration let L'utilisation de la variable avant sa déclaration entraîne une erreur ReferenceError.

Les variables restent dans la 'zone morte' temporaire du début du bloc jusqu'à la déclaration :

Exemple

// Ici, vous ne pouvez pas utiliser carName
let carName;