Apprends à répéter des actions avec les boucles for, while, do...while, et à contrôler leur flux avec break et continue.
La boucle for répète un bloc de code un nombre spécifique de fois. Sa syntaxe comporte trois parties :
for (initialization; condition; update) {
// code to repeat
}Le pattern le plus courant :
for (let i = 0; i < 5; i++) {
console.log('Iteration:', i);
}
// Output: 0, 1, 2, 3, 4Tu peux utiliser les boucles for pour parcourir des tableaux par index :
const colors = ['red', 'green', 'blue'];
for (let i = 0; i < colors.length; i++) {
console.log(colors[i]);
}La boucle while répète un bloc de code tant qu'une condition est vraie. Elle vérifie la condition avant chaque itération :
let count = 0;
while (count < 5) {
console.log(count);
count++;
}Utilise une boucle while quand tu ne sais pas à l'avance combien de fois la boucle doit s'exécuter — par exemple, pour lire une saisie utilisateur jusqu'à obtenir une valeur valide.
La boucle do...while est similaire, mais elle vérifie la condition après chaque itération. Cela garantit que le bloc de code s'exécute au moins une fois :
let num = 10;
do {
console.log(num);
num++;
} while (num < 5);
// Output: 10 (runs once even though 10 < 5 is false)Attention : Fais attention à toujours inclure une logique qui rend finalement la condition fausse. Sinon, tu crées une boucle infinie qui va bloquer le navigateur.
Deux mots-clés te donnent un contrôle plus fin sur l'exécution des boucles :
break — Sort immédiatement et complètement de la boucle.
for (let i = 0; i < 100; i++) {
if (i === 5) break;
console.log(i);
}
// Output: 0, 1, 2, 3, 4continue — Saute le reste de l'itération actuelle et passe à la suivante.
for (let i = 0; i < 6; i++) {
if (i === 3) continue;
console.log(i);
}
// Output: 0, 1, 2, 4, 5 (3 is skipped)Pour les boucles imbriquées, tu peux utiliser des labels pour sortir ou continuer une boucle externe spécifique :
outer: for (let i = 0; i < 3; i++) {
for (let j = 0; j < 3; j++) {
if (i === 1 && j === 1) break outer;
console.log(i, j);
}
}<ul id="list"></ul>
<script>
const fruits = ['Apple', 'Banana', 'Cherry', 'Date', 'Elderberry'];
const list = document.getElementById('list');
for (let i = 0; i < fruits.length; i++) {
const li = document.createElement('li');
li.textContent = `${i + 1}. ${fruits[i]}`;
list.appendChild(li);
}
</script>Combien de fois `for (let i = 0; i < 3; i++)` exécute-t-il son corps ?