TypeScript - Boucle while : Guide pour les débutants

Bonjour, futurs programmeurs ! Aujourd'hui, nous allons plonger dans l'un des concepts fondamentaux de la programmation : la boucle while. En tant que votre enseignant de informatique bienveillant du quartier, je suis excité de vous guider dans cette aventure. Ne vous inquiétez pas si vous êtes nouveau dans le codage - nous allons commencer par les bases et progresser pas à pas. Alors, prenez une tasse de café (ou votre boisson favorite), et mettons-nous à boucler !

Qu'est-ce qu'une boucle while ?

Avant de rentrer dans les détails, comprenons ce qu'est une boucle while. Imaginez que vous jouez à un jeu où vous devez lancer un dé jusqu'à ce que vous obtenir un six. Vous ne sauriez pas à l'avance combien de fois vous devrez lancer, n'est-ce pas ? C'est exactement là que la boucle while devient pratique dans la programmation !

Une boucle while vous permet de répéter un bloc de code aussi longtemps qu'une certaine condition est vraie. C'est comme dire à votre ordinateur : "Eh, continue de faire cela jusqu'à ce que je te dise d'arrêter !"

Syntaxe

Maintenant, regardons la syntaxe d'une boucle while en TypeScript :

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

C'est plutôt simple, non ? Voici ce que signifie chaque partie :

• while : Ce mot-clé indique à TypeScript que nous commencerons une boucle while.
• condition : Il s'agit d'une expression booléenne qui est vérifiée avant chaque itération de la boucle. Si elle est vraie, la boucle continue ; si elle est fausse, la boucle s'arrête.
• {} : Ces accolades contiennent le code qui sera exécuté à plusieurs reprises tant que la condition est vraie.

Diagramme de flux

Pour mieux comprendre comment fonctionne une boucle while, regardons un diagramme de flux :

┌─────────────┐
│   Début     │
└─────┬───────┘
│
▼
┌─────────────────┐
│ Vérifier la    │◄─────┐
│ condition      │      │
└─────────┬───────┘      │
│              │
▼              │
┌────────┐          │
┌────│  Vrai  │          │
│    └────┬───┘          │
│         │              │
│         ▼              │
│  ┌─────────────┐       │
│  │ Exécuter le │       │
│  │ code        │       │
│  └─────────────┘       │
│         │              │
│         └──────────────┘
│
│    ┌────────┐
└────►  Faux  │
└────┬───┘
│
▼
┌─────────────┐
│   Fin      │
└─────────────┘

Ce diagramme montre comment la boucle while vérifie constamment la condition et exécute le bloc de code jusqu'à ce que la condition devienne fausse.

Exemple : Boucle while

Plongons dans un exemple pratique. Nous allons créer un programme qui décompte de 5 à 1 :

let countdown: number = 5;

while (countdown > 0) {
console.log(countdown);
countdown--;
}

console.log("Décollage !");

Décomposons cela :

1. Nous commençons par déclarer une variable countdown et la définir à 5.
2. La boucle while vérifie si countdown est supérieur à 0.
3. Si c'est le cas, elle imprime la valeur actuelle de countdown.
4. Ensuite, elle diminue countdown de 1 en utilisant l'opérateur --.
5. Ce processus se répète jusqu'à ce que countdown ne soit plus supérieur à 0.
6. Enfin, elle imprime "Décollage !" une fois que la boucle se termine.

Lorsque vous exécutez ce code, vous verrez :

5
4
3
2
1
Décollage !

C'est génial, non ? C'est comme si nous avions créé notre propre petit compte à rebours de lancement de fusée !

Boucle while avec une instruction break

Parfois, vous pourriez vouloir quitter une boucle tôt en fonction d'une certaine condition. C'est là que l'instruction break devient pratique. C'est comme avoir une issue d'urgence dans votre boucle !

Modifions notre exemple de compte à rebours :

let countdown: number = 10;

while (countdown > 0) {
console.log(countdown);
countdown--;

if (countdown === 5) {
console.log("Nous y sommes à moitié !");
break;
}
}

console.log("Compte à rebours interrompu !");

Dans cet exemple, nous démarons le compte à rebours à 10, mais nous l'interrompons lorsque nous atteignons 5. La sortie sera :

10
9
8
7
6
5
Nous y sommes à moitié !
Compte à rebours interrompu !

L'instruction break nous permet de quitter la boucle prématurément lorsque une condition spécifique est remplie.

Boucle while vs. Boucle for

Maintenant, vous pourriez vous demander : "Pourquoi utiliser une boucle while quand nous avons des boucles for ?" Excellent pregunta ! Comparons-les :

Boucle while	Boucle for
Utilisée lorsque le nombre d'itérations est inconnu	Utilisée lorsque le nombre d'itérations est connu
La condition est vérifiée au début de chaque itération	L'initialisation, la condition et la mise à jour sont toutes sur une seule ligne
Peut être utilisée pour créer des boucles infinies plus facilement	Utilisée principalement pour des boucles finies
Structure plus flexible	Structure plus compacte

Voici un exemple rapide pour illustrer :

// Boucle `while`
let i: number = 0;
while (i < 5) {
console.log(i);
i++;
}

// Boucle `for` équivalente
for (let j: number = 0; j < 5; j++) {
console.log(j);
}

Les deux boucles imprimeront les nombres de 0 à 4. La boucle while est plus flexible, car vous pouvez modifier la variable de boucle (i) de manière plus complexe à l'intérieur du corps de la boucle. La boucle for, d'autre part, est plus concise lorsque vous savez exactement combien de fois vous souhaitez itérer.

Conclusion

Et voilà, les amis ! Nous avons parcouru le territoire des boucles while en TypeScript. De la compréhension de la syntaxe de base à l'exploration des instructions break et la comparaison avec les boucles for, vous êtes maintenant équipés des connaissances nécessaires pour utiliser les boucles while efficacement dans votre code.

Souvenez-vous, la programmation est comme apprendre à rouler à vélo - cela pourrait sembler不稳定 au début, mais avec de la pratique, vous serez bientôt en train de vous déplacer rapidement ! Alors, n'ayez pas peur d'expérimenter avec les boucles while dans vos propres projets. Essayez de créer un jeu de devinette, ou peut-être un programme qui calcule l'intérêt composé jusqu'à ce qu'un certain montant soit atteint.

Bonne programmation, et que vos boucles se terminent toujours !

Credits: Image by storyset