Différence entre let, const et var en JavaScript
Scope, hoisting, réassignation — tout comprendre pour choisir le bon mot-clé
SECTION 01
var : l'ancienne façon de déclarer
var a un scope de fonction (pas de bloc). Elle est « hoistée » en haut de la fonction et initialisée à undefined.
var nom = « Bob »; // ✅ Pas d'erreur — redéclaration autoriséeif (true)
console.log(x); // 10 — var IGNORE le bloc if
function test()
console.log(y); // ❌ ReferenceError — var respecte le scope FONCTION
⚠️ var est considéré comme obsolète en JavaScript moderne. Il cause des bugs subtils à cause du scope de fonction et du hoisting. Utilise let ou const à la place.
SECTION 02
let : la déclaration moderne et flexible
let a un scope de bloc (entre ). Elle ne peut pas être redéclarée dans le même scope, mais peut être réassignée.
age = 26; // ✅ Réassignation OKlet age = 30; // ❌ SyntaxError — redéclaration interdite
if (true)
console.log(x); // ❌ ReferenceError — x n'existe pas ici
// Idéal pour les boucles
for (let i = 0; i < 3; i++)
console.log(i); // ❌ ReferenceError — i n'existe pas ici
SECTION 03
const : la constante
const a le même scope de bloc que let, mais la variable ne peut pas être réassignée. Elle doit être initialisée à la déclaration.
PI = 3; // ❌ TypeError — réassignation interditeconst nom; // ❌ SyntaxError — doit être initialisée
Attention : const empêche la réassignation, pas la mutation. Les objets et tableaux déclarés avec const peuvent être modifiés :
user.age = 26; // ✅ Mutation OK — on modifie une propriété
user = ; // ❌ TypeError — on ne peut pas réassignerconst fruits = [« pomme », « banane »];
fruits.push(« orange »); // ✅ Mutation OK
fruits = []; // ❌ TypeError — réassignation interdite
Retiens : const protège la référence (la « boîte »), pas le contenu. Pour rendre un objet vraiment immuable, utilise Object.freeze().
SECTION 04
Tableau comparatif
| Critère | var | let | const |
|---|---|---|---|
| Scope | Fonction | Bloc | Bloc |
| Redéclaration | ✅ Oui | ❌ Non | ❌ Non |
| Réassignation | ✅ Oui | ✅ Oui | ❌ Non |
| Hoisting | Oui → undefined | Oui → TDZ (erreur) | Oui → TDZ (erreur) |
| Initialisation obligatoire | ❌ Non | ❌ Non | ✅ Oui |
| Recommandé en 2026 | ❌ Non | ✅ Quand la valeur change | ✅ Par défaut |
SECTION 05
Le hoisting expliqué
JavaScript « remonte » les déclarations de variables avant l'exécution. Mais le comportement diffère selon le mot-clé :
console.log(a); // undefined (pas d'erreur !)
var a = 10;// let — hoistée mais dans la « Temporal Dead Zone » (TDZ)
console.log(b); // ❌ ReferenceError: Cannot access 'b' before initialization
let b = 20;
// const — même comportement que let (TDZ)
console.log(c); // ❌ ReferenceError
const c = 30;
La Temporal Dead Zone (TDZ) est la période entre le début du bloc et la déclaration de la variable. Avec let et const, accéder à la variable dans cette zone provoque une erreur — c'est un comportement voulu pour éviter les bugs.
SECTION 06
Bonne pratique : const d'abord
const API_URL = « https://api.example.com »;
const user = ;
const items = [1, 2, 3];// 2. Utilise let uniquement quand la valeur change
let compteur = 0;
compteur++;
let resultat = null;
if (condition)
// 3. N'utilise JAMAIS var
// var est obsolète — aucune raison de l'utiliser en code moderne
Résumé : const par défaut → let si tu dois réassigner → var jamais. C'est la convention suivie par la quasi-totalité des projets JavaScript modernes, les linters (ESLint) et les guides de style (Airbnb, Google).
SECTION 07
Erreurs fréquentes
| Erreur | Problème | Solution |
|---|---|---|
| Utiliser var dans une boucle for | La variable fuit hors du bloc | Utiliser let |
| Penser que const rend un objet immuable | Les propriétés restent modifiables | const protège la référence, pas le contenu |
| Déclarer une const sans valeur | SyntaxError | Toujours initialiser : const x = … |
| Redéclarer une variable avec let | SyntaxError dans le même scope | Réassigner (x = newVal) au lieu de redéclarer (let x = …) |
| Accéder à une variable avant sa déclaration | ReferenceError (TDZ) | Toujours déclarer en haut du bloc |
SECTION 08
