Une boucle exécute un bloc de code plusieurs fois. La boucle for est utilisée quand on sait combien de fois on veut répéter — afficher les 10 premiers nombres, parcourir tous les éléments d'un tableau, dessiner une grille de 8×8 cases.
for (initialisation; condition; incrément) {
// instructions répétées
}
Les trois parties séparées par des ; :
for (let i = 1; i <= 5; i++) {
console.log(i);
}
// affiche : 1 2 3 4 5
Déroulement :
i = 1 → 1 <= 5 ? oui → console.log(1) → i devient 2
i = 2 → 2 <= 5 ? oui → console.log(2) → i devient 3
...
i = 5 → 5 <= 5 ? oui → console.log(5) → i devient 6
i = 6 → 6 <= 5 ? non → fin de la boucle
Le pattern le plus utilisé en programmation. On part de 0 et on s'arrête avant n.
for (let i = 0; i < 10; i++) {
console.log(i);
}
// 0 1 2 3 4 5 6 7 8 9 → exactement 10 tours
for (let i = 10; i > 0; i--) {
console.log(i);
}
// 10 9 8 7 6 5 4 3 2 1
for (let i = 0; i <= 20; i += 2) {
console.log(i); // 0 2 4 6 ... 20
}
L'usage le plus courant : passer en revue chaque élément.
let fruits = ["pomme", "banane", "cerise"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
fruits.length vaut 3 → on tourne pour i = 0, 1, 2.fruits[i] accède au i-ème élément.Pourquoi i < fruits.length et pas i <= 2 ?
Parce que le tableau peut grandir. Si on ajoute un fruit, fruits.length devient 4 automatiquement, la boucle s'adapte. Avec i <= 2 codé en dur, on oublierait de le mettre à jour. Toujours < length.
for...of — version simplifiéeQuand on veut juste chaque élément, sans s'occuper de l'index, JavaScript moderne propose une syntaxe plus lisible :
let fruits = ["pomme", "banane", "cerise"];
for (let fruit of fruits) {
console.log(fruit);
}
Plus court, et pas de risque d'erreur d'indice. À utiliser dès que tu n'as pas besoin de i.
Quand utiliser laquelle ?
for classique : si tu as besoin de l'index (i), de sauter des éléments, de parcourir à rebours…for...of : si tu veux juste chaque élément un par un.break et continueDeux mots-clés qui modifient le déroulement d'une boucle.
break — sortir immédiatementfor (let i = 0; i < 100; i++) {
if (i === 5) {
break; // sort de la boucle dès que i vaut 5
}
console.log(i); // 0 1 2 3 4
}
Utile quand on cherche quelque chose : dès qu'on l'a trouvé, inutile de continuer.
continue — passer au tour suivantfor (let i = 0; i < 10; i++) {
if (i % 2 === 0) {
continue; // saute les pairs
}
console.log(i); // 1 3 5 7 9
}
continue saute le reste du tour courant et passe directement à l'incrément.
// ❌ i ne change jamais → boucle infinie, page bloquée
for (let i = 0; i < 10; ) {
console.log(i);
}
Toujours vérifier que l'incrément fait progresser la condition vers la sortie.
// ❌ tourne 11 fois (i = 0, 1, ..., 10), pas 10
for (let i = 0; i <= 10; i++) { ... }
// ✅ tourne 10 fois (i = 0, 1, ..., 9)
for (let i = 0; i < 10; i++) { ... }
Règle simple : "j'ai N éléments, donc i < N".
// ❌ Très difficile à lire, à éviter
for (let i = 0; i < 10; i++) {
if (condition) i += 3; // saute des tours façon "magie"
console.log(i);
}
Si tu dois sauter des tours, utilise continue. Si tu veux changer le rythme, change l'incrément. Modifier i au milieu du corps, c'est un piège pour les futurs lecteurs (toi inclus).
function tableDeMultiplication(n) {
for (let i = 1; i <= 10; i++) {
console.log(`${n} × ${i} = ${n * i}`);
}
}
tableDeMultiplication(7);
Et pour faire toutes les tables d'un coup, on imbrique :
for (let n = 1; n <= 10; n++) {
console.log(`--- Table de ${n} ---`);
for (let i = 1; i <= 10; i++) {
console.log(`${n} × ${i} = ${n * i}`);
}
}
Une boucle dans une boucle = on multiplie le nombre de tours. 10 × 10 = 100 lignes affichées.
for (init; condition; increment) { ... } — trois parties séparées par ;.for (let i = 0; i < n; i++).for (let element of tableau).break arrête la boucle. continue saute au tour suivant.< pour N tours, <= pour N+1 tours.