const et let permettent de stocker une valeur, au même titre que var. Cependant, ils sont plus performants et permettent de régler certains problèmes associés à var.

const

La variable const est une abréviation du terme constante. Autrement dit, une variable dont le contenu ne devrait jamais changer. C'est en quelque sorte l'équivalent de créer un fichier en lecture seule.

Par exemple, le contenu de la variable const movie = "Les boys" ne pourra jamais être mise à jour. Tenter de remplacer sont contenu via movie = "Bon cop, Bad cop", entrainera l'erreur suivante:

Uncaught TypeError: Assignment to constant variable.

let

Contrairement à const, la variable let est plus permissive. Son contenu peut être mis à jour sans problème.

Par exemple, le contenu de la variable let movie = "C.R.A.Z.Y" pourra être mise à jour via movie = "Mommy" sans soucis.

Contexte (scope)

let et const ont un contexte de bloc. Autrement dit, leur contexte est toujours limité par les accolades {}, que ce soit celles d'une fonction ou encore celles d'un if.

Par exemple:

let movie = "De père en flic";

if (type == "drame") {
  let movie = "Polytechnique";
  console.log(movie) // Polytechnique
}

console.log(movie) // De père en flic

Puisque le contexte des variables movie est différent (à cause des accolades), elles sont considérées comme deux variables distinctes, même si elles porte le même nom.

Tandis que les variables définies via var ont un contexte de fonction. Autrement dit, seul les accolades d'une fonction définissent leur contexte et non celles des conditions, ce qui peut porter à confusion. Leur contexte est donc global par défaut.

Le même exemple avec var produit donc un résultat différent.

var movie = "De père en flic";

if (type == "drame") {
  var movie = "Polytechnique";
  console.log(movie) // Polytechnique
}

console.log(movie) // Polytechnique

Redéfinition

Imaginons la variable suivante var movie = "Les 7 jours du Talion" et que plus tard, par manque d'imagination, une nouvelle variable est définie à nouveau avec le même nom: var movie = "Starbuck".

Que se passera-t-il?

Il serait tentant de croire que JavaScript nous avertira que la variable movie existe déjà et donc qu'elle ne peut pas être recréée…

Malheureusement, une variable définie via le mot-clé var accepte d'être définie plusieurs fois 🤦‍♂️. Chaque nouvelle définition ne fait que mettre à jour la valeur assignée à la variable, ce qui peut engendrer des erreurs difficiles à repérer.

Heureusement, une variable définie avec let ou const nous avertira si nous tentons de créer une deuxième variable utilisant le même nom, nous évitant ainsi des frustrations inutiles.

Uncaught SyntaxError: Identifier 'movie' has already been declared

Choisir entre var, const et let

Choisir entre varconst et let peut être un dilemme.

Prenant pour acquis qu'une variable const expose la vocation d'une variable plus explicitement, puisqu'elle indique une valeur qui ne devrait jamais changée, contrairement à let et var et considérant les avantages de const et let sur var, cet ordre d'utilisation ce veut une bonne règle du pouce 👍

  1. const (par défaut)

  2. let si le contenu d'une variable doit pouvoir changer

  3. var en dernier recours

🤫

Je suis figurant dans l’un des films mentionnés sur cette page 😅