Temps de lecture approximative : 8 minutes

Les boucles

En JS, comme dans bien d'autres langages de programmation, les boucles sont des éléments clés. Il est essentiel de les maîtriser pour développer efficacement. Que l'on développe une application web, une fusée ou un jeu vidéo, on a besoin de boucles.

Les boucles permettent de répéter l'exécution d'une portion de code un certain nombre de fois en fonction d'un test de condition. Tant que ce dernier est vérifié, alors la portion de code s'exécute. Pour une exécution d'une portion de code, on parle d'une itération de la boucle. Quel que soit le type de boucles utilisé, il sera nécessaire d'employer une condition pour mettre fin à la boucle.

En JS, il existe plusieurs types de boucles différentes. Elles remplissent la même finalité mais comportent des différences. Dans notre cours sur le JavaScript, nous utiliseront pour le moment que les deux suivantes :

  • while
  • for

Une partie explicative est dédiée à chaque boucle.

Boucle while

L'instruction while pourrait être traduite en français par « tant que ». Si on vulgarise l'utilisation de cette boucle, on peut dire que cette dernière va exécuter la même portion de code tant que la condition est vérifiée. Ci-après un exemple avec les deux syntaxes possibles.

JS
let test = 0;
while(test < 10) {
   console.log('La variable $test a ' + test + ' comme valeur.');
   test++;	
}
Résultat dans la console
La variable $test a 0 comme valeur.
La variable $test a 1 comme valeur.
La variable $test a 2 comme valeur.
La variable $test a 3 comme valeur.
La variable $test a 4 comme valeur.
La variable $test a 5 comme valeur.
La variable $test a 6 comme valeur.
La variable $test a 7 comme valeur.
La variable $test a 8 comme valeur.
La variable $test a 9 comme valeur.

L'exemple démarre avec la déclaration de la variable test avec une valeur de zéro. Si vous avez suivi les chapitres précédents, vous ne devez pour le moment, pas avoir de surprise jusqu'ici. La boucle va donc exécuter la portion de code entre les accolades { et } tant que la condition est vérifiée.

On demande donc à notre boucle while d'afficher une chaîne de caractères et d'incrémenter test, tant que test est strictement inférieure à 10. L'étape d'incrémentation de la variable test est indispensable dans notre cas, car sinon le test de condition serait éternellement non vérifié, et la boucle ne s'arrêterait jamais. Si c'est le cas, on appelle ça une boucle infinie.

Boucle for

Comme énoncé précédemment, toutes les boucles ont la même finalité : répéter une portion de code en boucle. Nous avons vu précédemment la boucle while. La boucle for est un autre type de boucle. Elle est largement utilisée car elle a des avantages indéniables, mais a une syntaxe assez particulière, surtout pour les débutants. Tout d'abord, l'instruction for pourrait être traduite en français par « pour ». Reprenons le même exemple qu'avec la boucle while pour mettre en évidence les différences. En JS, la boucle for a deux syntaxes possibles.

JS
for(let yolo = 1;yolo < 10;yolo++) {
   console.log('Mon chiffre préféré est le ' + yolo);	
}
Résultat dans la console
Mon chiffre préféré est le 1
Mon chiffre préféré est le 2
Mon chiffre préféré est le 3
Mon chiffre préféré est le 4
Mon chiffre préféré est le 5
Mon chiffre préféré est le 6
Mon chiffre préféré est le 7
Mon chiffre préféré est le 8
Mon chiffre préféré est le 9

Alors que la boucle while ne prend qu'un test de condition entre ses parenthèses, la boucle for en prend 3 pour avoir une syntaxe plus condensée. Les 3 éléments de la boucle for sont les suivants :

  • Une initialisation de variable ;
  • Un test de condition ;
  • Une incrémentaiton de variable.

Le premier élément de la boucle for correspond tout simplement à la l'initialisation de la variable yolo. Alors que dans la boucle while, cette initialisation était bel et bien en dehors de la boucle, avec la boucle for c'est le premier élément à préciser.

Pas de surprise pour le deuxième élément, la boucle for a besoin comme toutes les boucles d'un test de condition.

Le dernier élément correspond à une incrémentation ou une décrémentation de variable. En l'occurence, on incrémente la variable yolo. Ce dernier élément était à l'intérieur de la boucle while.

Les éléments sont séparés par des points virgules ;. Au final, le résultat est le même mais la syntaxe est plus condensée.

Ce chapitre est très important car les boucles sont essentielles pour développer. Qu'on développe en JS ou dans un autre langage de programmation, elles sont incontournables. Prenez le temps de relire autant de fois que nécessaire ce chapitre pour éclaircir toutes les zones d'ombres.