Les boucles peuvent exécuter un bloc de code tant qu'une condition spécifiée est vraie.
while
La boucle while
parcourt un bloc de code tant qu'une condition spécifiée est vraie.
while (condition) {
// code block to be executed
}
Dans l’exemple suivant, le code de la boucle sera exécuté encore et encore, tant que une variable (i) est inférieure à 10 :
while (i < 10) {
text += "The number is " + i;
i++;
}
Essayez-le vous-même →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript While Loop</h2>
<p id="demo"></p>
<script>
let text = "";
let i = 0;
while (i < 10) {
text += "<br>The number is " + i;
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Si vous oubliez d'augmenter la variable utilisée dans la condition, la boucle ne se terminera jamais. Cela fera planter votre navigateur.
do while
La boucle do while
est une variante de la boucle while. Cette boucle va exécutez le bloc de code une fois, avant de vérifier si la condition est vraie, alors il le fera répétez la boucle tant que la condition est vraie.
do {
// code block to be executed
}
while (condition);
L'exemple ci-dessous utilise une boucle do while
. La boucle sera toujours exécuté au moins une fois, même si la condition est fausse, car le bloc de code est exécuté avant que la condition ne soit testée :
do {
text += "The number is " + i;
i++;
}
while (i < 10);
Essayez-le vous-même →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Do While Loop</h2>
<p id="demo"></p>
<script>
let text = ""
let i = 0;
do {
text += "<br>The number is " + i;
i++;
}
while (i < 10);
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
N'oubliez pas d'augmenter la variable utilisée dans la condition, sinon la boucle ne finira jamais !
pour
et de pendant
Si vous avez lu le chapitre précédent, à propos de la boucle for, vous découvrirez qu'une boucle while est à peu près la même chose qu'une boucle for, avec les instructions 1 et 3 omises.
La boucle dans cet exemple utilise une boucle for
pour récupérer la voiture noms du tableau des voitures :
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
for (;cars[i];) {
text += cars[i];
i++;
}
Essayez-le vous-même →
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
for (;cars[i];) {
text += cars[i] + "<br>";
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
La boucle dans cet exemple utilise une boucle while
pour collecter les noms de voitures du tableau cars :
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
while (cars[i]) {
text += cars[i];
i++;
}
Essayez-le vous-même →
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
while (cars[i]) {
text += cars[i] + "<br>";
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>