mozilla

let

Cette fonction, proposition pour ECMAScript 6 (Harmony), est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

L'instruction let permet de déclarer une variable dont la portée est celle du bloc courant, éventuellement en initialisant sa valeur.

Syntaxe

let var1 [= valeur1] [, var2 [= valeur2]] [, ..., varN [= valeurN]];

Paramètres

var1, var2, …, varN
Le nom de la variable. Cela peut être n'importe quel identifiant valide.
valeur1, valeur2, …, valeurN
La valeur à utiliser pour initialiser la variable. Cela peut être n'importe quelle expression légale.

Description

let permet de déclarer des variables dont la portée est limitée à celle du bloc dans lequel elles sont déclarées. Le mot-clé var, quant à lui, permet de définir une variable globale ou locale à une fonction (sans distinction des blocs utilisés dans la fonction).

Les portées de bloc avec let

Le mot-clé let permet de définir des variables au sein d'un bloc.

if (x > y) {
  let gamma = 12.7 + y;
  i = gamma * x;
}

let permet de créer des alias pour des pseudo-espaces de noms utilisés dans les modules complémentaires. (Pour plus d'informations voir la page les meilleures pratiques liées à la sécurité dans les modules complémentaires.)

let Cc = Components.classes, Ci = Components.interfaces;

let peut parfois permettre de rendre le code plus lisible lorsqu'on utilise des fonctions internes.

var list = document.getElementById("list");

for (var i = 1; i <= 5; i++) {
  var item = document.createElement("LI");
  item.appendChild(document.createTextNode("Élément " + i));

  let j = i;
  item.onclick = function (ev) {
    console.log("Clic sur l'élément " + j + ".");
  };
  list.appendChild(item);
}

Dans l'exemple précédent, cela fonctionne comme on l'attend car les cinq instances de la fonction anonyme sont liées à cinq instances différentes de j. Si on remplace let par var ou qu'on utilise i à la place de j, on n'aura pas l'effet escompté car on aura une même variable pour cette portée (au lieu de 5 différentes).

Règles de portées

Les variables déclarées avec let appartiennent à la portée du bloc dans lequel elles sont définies et indirectement aux portées des blocs de ce bloc. D'une certaine façon let fonctionne comme var, la seule différence dans cette analogie est que let fonctionne avec les portées de bloc et var avec les portées des fonctions :

function varTest() {
  var x = 31;
  if (true) {
    var x = 71;  // c'est la même variable !
    console.log(x);  // 71
  }
  console.log(x);  // 71
}

function letTest() {
  let x = 31;
  if (true) {
    let x = 71;  // c'est une variable différente
    console.log(x);  // 71
  }
  console.log(x);  // 31
}

Au niveau le plus haut (la portée globale), let fonctionne exactement comme var. Par exemple :

var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // "global"

Zone morte temporaire (temporal dead zone / TDZ)  et les erreurs liées à let

Lorsqu'on redéclare une même variable au sein d'une même portée de bloc, cela entraîne une exception TypeError.

if (x) {
  let toto;
  let toto; // TypeError
}

Si on redéclare une variable pour le corps d'une fonction, cela ne pose aucun problème :

function faire_quelque_chose() {
  let toto;
  let toto; // Cela fonctionne.
}

Pour ECMAScript 6, let ne remonte pas la variable au début de la porté. Si on fait référence à une variable dans un bloc avant que celle-ci soit déclarée avec let, cela entraînera une exception ReferenceError. En effet, la variable est placée dans une « zone morte temporaire » entre le début du bloc et le moment où la déclaration est traitée.

function faire_quelque_chose() {
  console.log(toto); // ReferenceError
  let toto = 2;
}

Il est possible d'obtenir des erreurs au sein de l'instruction Instructions/switch. En effet, il y a un seul bloc implicite pour cette instruction.

switch (x) {
  case 0:
    let toto;
    break;
    
  case 1:
    let toto; // TypeError for redeclaration.
    break;
}

Les variables déclarées avec let et les boucles for

Le mot-clé let permet de lier des variables localement dans la portée des boucles for. Contrairement au mot-clé var qui lui rend les variables visibles depuis l'ensemble de la fonction qui contient la boucle.

var i=0;
for ( let i=i ; i < 10 ; i++ ) {
  console.log(i);
}

Règles de portées

for (let expr1; expr2; expr3) instruction

Dans cet exemple, expr2, expr3, et instruction sont contenues dans un bloc implicite qui contient la variable de bloc local déclarée avec let expr1.

Exemples

let / var

Lorsqu'il est utilisé dans un bloc, let permet de limiter la portée de la variable à ce bloc. var quant à lui limite la portée de la variable à la fonction.

var a = 5;
var b = 10;

if (a === 5) {
  let a = 4; // La portée est celle du bloc if
  var b = 1; // La portée est celle interne à la fonction

  console.log(a);  // 4
  console.log(b);  // 1
} 

console.log(a); // 5
console.log(b); // 1

let utilisé dans les boucles

Le mot-clé let permet de lier des variables à la portée de la boucle plutôt qu'à celle de la fonction (avec var) :

for (let i = 0; i<10; i++) {
  console.log(i); // 0, 1, 2, 3, 4 ... 9
}

console.log(i); // i n'est pas défini

Extensions non-standards liées à let

Les syntaxes pour le bloc let et l'expression let ne sont pas standards et seront retirées dans un avenir proche. Ne pas les utiliser. Pour plus de détails, voir bug 1023609 et bug 1167029.

Le bloc let

Le bloc let fournit une méthode pour associer des valeurs à des variables au sein d'un bloc sans affecter les variables ayant le même nom en dehors de ce bloc.

Syntaxe

let (var1 [= valeur1] [, var2 [= valeur2]] [, ..., varN [= valeurN]]) instruction;

Description

Le bloc let fournit une portée locale pour des variables dans un bloc donnée. En dehors de cela, il fonctionne exactement comme un bloc d'instruction. Les variables qui sont déclarées avec le mot-clé var à l'intérieur de ce bloc seront visible en dehors du bloc et pour l'ensemble de la fonction. Pour cette syntaxe, il est obligatoire d'utiliser les parenthèses entre let et le bloc. Si les parenthèses ne sont pas présentes, cela entraînera une erreur de syntaxe.

Exemple

var x = 5;
var y = 0;

let (x = x+10, y = 12) {
  console.log(x+y); // 27
}

console.log(x + y); // 5

Les règles qui s'appliquent à ce bloc sont les mêmes que pour les autres blocs de code en JavaScript. Ainsi les variables déclarées avec let dans le bloc seront locales au bloc.

Règles de portées

La portée des variables définies en utilisant let sera celle du bloc let ainsi que les portées des blocs imbriqués dans ce bloc (sauf si les variables de ces blocs imbriqués utilisent les mêmes noms).

L'expression let

Le support de l'expression let a été abandonné avec Gecko 41 bug 1023609.

L'expression let permet de déclarer des variables qui ne sont visibles qu'au sein d'une seule expression.

Syntaxe

let (var1 [= valeur1] [, var2 [= valeur2]] [, ..., varN [= valeurN]]) expression;

Exemple

Voici comment on peut utiliser cette expression :

var a = 5;
let(a = 6) console.log(a); // 6
console.log(a); // 5

Règles de portées

Soit une expression let :

let (déclarations) expression

On aura un bloc implicite créé autour de expression.

Spécifications

Spécification Statut Commentaires
ECMAScript 2015 (6th Edition, ECMA-262)
La définition de 'Let and Const Declarations' dans cette spécification.
Standard Définition initiale. Cette définition n'inclue pas les expressions et blocs let.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari
Support simple 41.0 2.0 (1.8.1) [1] 11 17 ?
Zone morte temporaire (TDZ) ? 35 (35) [1] ? ? ?
Expression let Pas de support 2.0 (1.8.1)-40 (40)[1] Pas de support Pas de support Pas de support
Bloc let Pas de support 2.0 (1.8.1) [1] Pas de support Pas de support Pas de support
Fonctionnalité Android Chrome pour Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple ? 41.0 1.0 (1.8.1) [1] ? ? ?
Zone morte temporaire (TDZ) ? ? 35.0 (35) [1] ? ? ?
Expression let Pas de support Pas de support 1.0 (1.8.1)-40.0 (40) [1] Pas de support Pas de support Pas de support
Bloc let Pas de support Pas de support 1.0 (1.8.1) [1] Pas de support Pas de support Pas de support

Notes spécifiques à Firefox

  • [1] : Uniquement disponible dans les blocs de code HTML avec <script type="application/javascript;version=1.7"> (ou avec une version supérieure). Les balises de script XUL peuvent accéder à ces fonctionnalités sans ce bloc. Voir bug 932517 et bug 932513 pour plus d'informations. Cependant, cette fonctionnalité n'est pas standard et peut éventuellement poser problème avec les autres navigateurs.
  • Pour SpiderMonkey, la conformité à ES6 pour l'instruction let est tracée dans le bug 950547, les extensions non-standard seront retirées dans un avenir proche bug 1023609.

Voir aussi

Étiquettes et contributeurs liés au document

Contributeurs à cette page : fscholz, teoli, SphinxKnight
Dernière mise à jour par : SphinxKnight,
Masquer la barre latérale