Les Boucles en JavaScript

Introduction aux Boucles

Dans le monde de la programmation, les boucles sont des outils cruciaux permettant de répéter une série d'instructions jusqu'à ce qu'une condition définie ne soit plus remplie. Le terme itérer signifie simplement "répéter", et chaque boucle continue d'itérer tant que la condition d'arrêt n'est pas atteinte.

Boucle While

La boucle while exécute un ensemble d'instructions tant qu'une condition spécifiée est évaluée comme vraie. Une fois que la condition devient fausse, la boucle s'arrête. La condition est généralement définie avant le début de la boucle, et un certain nombre de variables sont souvent modifiées dans le corps de la boucle pour déterminer son arrêt.

while (condition) {
  // Bloc de code à exécuter
}

Exemple :

let i = 0;
while (i < 5) {  
  console.log(i);  
  i++;
}

Sortie :

0
1
2
3
4

Boucle Do…While

Le bloc de code dans une boucle do…while s'exécute au moins une fois avant de vérifier la condition. Si cette condition est toujours vraie, la boucle continue. Sinon, elle se termine quand la condition devient fausse.

let x = 0;
let i = 0;
do {  
  x = x + i;
  console.log(x);
  i++;
} while (i < 5);

Sortie :

0
1
3
6

Boucle For

La boucle for se compose de trois parties essentielles, séparées par des points-virgules : - Initialisation : point de départ de la boucle avec la variable d'itération, - Condition d'arrêt : détermine quand arrêter la boucle, - Itération : modifie la variable d'itération après chaque boucle.

for (let i = 0; i < 4; i++) {  
  console.log(i);
}

Sortie :

0
1
2
3

Boucle For...of

Pour accéder directement aux valeurs d'un objet, la boucle for...of est employée. Contrairement à une boucle for classique, cette méthode itère sur les valeurs directement, sans se soucier des indices.

const fruits = ['pomme', 'banane', 'cerise'];
for (const fruit of fruits) {  
  console.log(fruit);
}

Sortie :

pomme
banane
cerise

Boucle For...in

Cette boucle itère sur les clés d'un objet. Pour chaque clé, on peut éventuellement accéder à la valeur correspondante par référence d'index.

Accès aux clés :

const panier = { banane: 2, pomme: 5, cerise: 0 };
for (const fruit in panier) {  
  console.log(fruit);
}

Sortie :

banane
pomme
cerise

Accès aux valeurs :

for (const fruit in panier) {  
  console.log(panier[fruit]);
}

Sortie :

2
5
0

Boucle Inversée

Il est également possible d'itérer à l'envers avec une boucle for en diminuant la variable à chaque itération.

const fruits = ['abricot', 'banane', 'cerise'];
for (let i = fruits.length - 1; i >= 0; i--) {  
  console.log(`${i}. ${fruits[i]}`);
}

Sortie :

2. cerise
1. banane
0. abricot

Parcourir des Tableaux et Objets

Pour parcourir un tableau, vous pouvez utiliser la propriété .length. Par exemple :

const poissons = ['saumon', 'clown', 'merlan'];
for (let i = 0; i < poissons.length; i++) {  
  console.log(poissons[i]);
}

Sortie :

saumon
clown
merlan

Pour parcourir les paires clé-valeur d'un objet, utilisez la méthode Object.entries() qui retourne un tableau d'entrées.

Exemple :

const objet = {  
  nom: 'Codecademy',  
  age: 10,  
};
const mesEntrees = Object.entries(objet);
console.log(mesEntrees);

Sortie :

[ [ 'nom', 'Codecademy' ], [ 'age', 10 ] ]

Pour afficher chaque entrée :

for (const [cle, valeur] of mesEntrees) {  
  console.log(`${cle}: ${valeur}`);
}

Sortie :

nom: Codecademy
age: 10

Utilisation du Mot-clé Break

Le mot-clé break permet de sortir d'une boucle de manière prématurée. Il peut être utilisé pour quitter une boucle lorsque certaines conditions sont remplies.

for (let i = 0; i < 99; i++) {  
  if (i > 5) {    
    break;  
  }  
  console.log(i);  
}

Sortie :

0
1
2
3
4
5

Boucle For Nestsée

Une boucle for nested est une boucle placée à l'intérieur d'une autre boucle. La boucle interne complète toutes ses itérations pour chacune des itérations de la boucle externe.

for (let exter = 0; exter < 2; exter++) {  
  for (let inter = 0; inter < 3; inter++) {  
    console.log(`${exter}-${inter}`);  
  }
}

Sortie :

0-0
0-1
0-2
1-0
1-1
1-2