Boucle For en JavaScript

Les Boucles For peuvent exécuter un bloc de code un certain nombre de fois.

Les Boucles For sont fondamentales pour des tâches telles que l'exécution d'une action plusieurs fois.

La Boucle For

L'instruction for crée une boucle avec trois expressions optionnelles :

for ( exp 1 ; exp 2 ; exp 3 ) {
// bloc de code à exécuter
}

exp 1 est exécutée (une fois) avant l'exécution du bloc de code.

exp 2 définit la condition pour exécuter le bloc de code.

exp 3 est exécutée (à chaque fois) après que le bloc de code a été exécuté.

Exemple

for (let i = 0; i < 5; i++) {
text += "Le nombre est " + i + "<br>";
}
Essayez-le vous-même »

D'après l'exemple ci-dessus, vous pouvez comprendre que :

exp 1 définit une variable avant le début de la boucle (let i = 0).

exp 2 définit la condition pour que la boucle s'exécute (i doit être inférieur à 5).

exp 3 augmente une valeur (i++) après que le bloc de code a été exécuté.



Exemple

Utilisez une for boucle pour collecter les noms de voitures du tableau cars :

const cars = ["BMW", "Volvo", "Saab", "Ford"];
let len = cars.length;

let text = "";
for (let i = 0; i < len; i++) {
text += cars[i];
}
Essayez-le vous-même »

Comment utiliser exp 1

exp 1 est utilisé pour initialiser la ou les variables utilisées dans la boucle (let i = 0).

exp 1 est optionnel.

Vous pouvez omettre exp 1 si la valeur est définie avant le début de la boucle :

Exemple

const cars = ["BMW", "Volvo", "Saab", "Ford"];
let len = cars.length;

let i = 2;

let text = "";
for (; i < len; i++) {
text += cars[i] + "<br>";
}
Essayez-le vous-même »

Comment utiliser exp 2

exp 2 est utilisé pour évaluer la condition de la variable initiale (i < len).

exp 2 est également optionnel.

Si exp 2 retourne false , la boucle se terminera.

Remarque

Si vous omettez exp 2, vous devez fournir un break à l'intérieur de la boucle.

Sinon, la boucle ne se terminera jamais.

Cela fera planter votre navigateur.


Comment utiliser exp 3

exp 3 incrémente la valeur de la variable initiale (i++).

exp 3 est optionnel.

exp 3 peut effectuer diverses opérations, comme une incrémentation négative (i--), une incrémentation positive (i = i + 15), ou autre chose.

exp 3 peut être omis (si vous incrémentez la valeur à l'intérieur de la boucle) :

Exemple

const cars = ["BMW", "Volvo", "Saab", "Ford"];
let len = cars.length;

let i = 0;

let text = "";
for (; i < len; ) {
text += cars[i] + "<br>";
i++;
}
Essayez-le vous-même »

Portée de la Boucle

Utiliser var dans une boucle :

Exemple

var i = 5;

for (var i = 0; i < 10; i++) {
// du code
}

// Ici i est 10
Essayez-le vous-même »

Utiliser let dans une boucle :

Exemple

let i = 5;

for (let i = 0; i < 10; i++) {
// du code
}

// Ici i est 5
Essayez-le vous-même »

Dans le premier exemple, en utilisant var , la variable déclarée dans la boucle redéclare la variable en dehors de la boucle.

Dans le deuxième exemple, en utilisant let , la variable déclarée dans la boucle ne redéclare pas la variable en dehors de la boucle.

Lorsque let est utilisé pour déclarer la variable i dans une boucle, la variable i ne sera visible qu'à l'intérieur de la boucle.