Javascript : différence entre let et var

En JavaScript, let et var sont deux mots-clés utilisés pour déclarer des variables, mais ils ont des différences importantes dans leur portée (scope) et leur comportement.

Portée (Scope)

var: Les variables déclarées avec var ont une portée de fonction (function scope). Cela signifie qu'une variable déclarée avec var à l'intérieur d'une fonction est visible dans toute la fonction, mais n'est pas accessible en dehors de cette fonction.

let: Les variables déclarées avec let ont une portée de bloc (block scope). Cela signifie qu'une variable déclarée avec let à l'intérieur d'un bloc (par exemple, une boucle for, une condition if, ou un bloc de code entre des accolades {}) est uniquement visible à l'intérieur de ce bloc et n'est pas accessible en dehors de celui-ci.

Voici un exemple pour illustrer cela :

function exampleScope() {
if (true) {
var x = 10; // Déclaration de variable avec var
let y = 20; // Déclaration de variable avec let
console.log(x); // Affiche 10
console.log(y); // Affiche 20
}
console.log(x); // Affiche 10 (accessible en dehors du bloc)
// console.log(y); // Erreur : y is not defined (non accessible en dehors du bloc)
}

exampleScope();

Hoisting

var: Les déclarations de variables avec var sont "hissées" (hoisted) en haut de leur contexte d'exécution. Cela signifie que la déclaration de la variable est soulevée en haut du contexte, mais l'initialisation reste à sa position d'origine. La variable sera donc accessible avant sa déclaration dans le code, mais sa valeur sera undefined jusqu'à ce qu'elle soit réellement initialisée.

let: Les déclarations de variables avec let sont également "hissées", mais elles ne sont pas initialisées jusqu'à leur déclaration dans le code. Cela signifie qu'on ne peut pas accéder à la variable avant sa déclaration dans le code.

Exemple :

console.log(a); // Affiche undefined (la déclaration est hissée, mais la valeur n'est pas définie)
// console.log(b); // Erreur : Cannot access 'b' before initialization

var a = 10;
let b = 20;

Il est recommandé d'utiliser let au lieu de var dans la plupart des cas car cela favorise une meilleure encapsulation des variables et évite certaines erreurs potentielles liées à la portée et au hoisting. Cependant, si vous travaillez sur un projet plus ancien ou avec du code existant, vous pouvez encore rencontrer des déclarations var.