📘 Chapitre 4 – Boucles : for, while, break

1. 🎯 Objectif pédagogique

Apprendre à répéter des instructions en JavaScript grâce aux boucles for et while, et comprendre l’usage des mots-clés break et continue pour contrôler l’exécution.

2. 📚 Concepts abordés

  • Structure de la boucle for
  • Boucle while
  • Boucle do...while
  • Mots-clés break et continue
  • Applications pour parcourir des nombres ou des tableaux

3. 🧠 Explication théorique

Une boucle permet d’exécuter un bloc de code plusieurs fois, sans le réécrire.

Boucle for :

for (let i = 1; i <= 5; i++) {
  console.log("Itération n° " + i);
}

Boucle while :

let compteur = 1;
while (compteur <= 3) {
  console.log("Compteur : " + compteur);
  compteur++;
}

Boucle do...while :

let x = 0;
do {
  console.log("Valeur de x : " + x);
  x++;
} while (x < 2);

break et continue :

  • break interrompt complètement la boucle.
  • continue passe à l’itération suivante.

Exemple :

for (let i = 1; i <= 5; i++) {
  if (i === 3) continue; // saute le 3
  console.log(i);
}

4. 🛠 Tutoriel pratique

Résumé

Nous allons créer un script qui affiche les nombres de 1 à 10, mais ignore le 5.

Arborescence du projet 

mon_projet/
├── index.html
└── script.js

Étape 1 : Fichier HTML 

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <title>Boucles JS</title>
</head>
<body>
  <h1>Exemple de boucles</h1>
  <script src="script.js"></script>
</body>
</html>

Étape 2 : Code JavaScript 

for (let i = 1; i <= 10; i++) {
  if (i === 5) continue; // sauter le 5
  console.log("Nombre : " + i);
}

Étape 3 : Test

Ouvre index.html et regarde la console pour voir les résultats.

5. 🧾 Résumé et points-clés

  • La boucle for est idéale quand on connaît le nombre d’itérations.
  • La boucle while est utile quand on ne sait pas à l’avance combien de fois on doit répéter.
  • break et continue permettent de contrôler le flux de la boucle.