Instructions de répétition en TypeScript

Cet article explique les instructions de répétition en TypeScript.

YouTube Video

L'instruction for en TypeScript

L'instruction for en TypeScript est une structure de boucle de base pour effectuer des opérations répétées. Dans une boucle for, le même bloc de code peut être exécuté plusieurs fois en fonction d'un nombre spécifié ou de conditions.

Syntaxe de base

1for (initialization; condition; update) {
2    // Code to execute repeatedly while the condition is true
3}

• initialisation: C'est la partie qui n'est exécutée qu'une seule fois avant de démarrer la boucle. Initialiser les variables telles que les compteurs de boucle.
• Conditions (condition): Détermine si la boucle continue. Si vrai, continuer à boucler, et si faux, sortir.
• Mise à jour (mise à jour) : Exécuter à la fin de chaque boucle et mettre à jour le compteur de boucle.

Exemple 1 : Boucle for basique

Dans l'exemple ci-dessous, cela affiche les nombres de 0 à 4 dans l'ordre.

1for (let i = 0; i < 5; i++) {
2    console.log("The value of i is: " + i);
3}
4// Outputs:
5// The value of i is: 0
6// The value of i is: 1
7// The value of i is: 2
8// The value of i is: 3
9// The value of i is: 4

Exemple 2 : Boucle for avec un tableau

Vous pouvez également utiliser une boucle for pour traiter les éléments d'un tableau dans l'ordre.

1let fruits: string[] = ["apple", "banana", "cherry"];
2
3for (let i = 0; i < fruits.length; i++) {
4    console.log("Fruit: " + fruits[i]);
5}
6// Outputs:
7// Fruit: apple
8// Fruit: banana
9// Fruit: cherry

Exemple 3 : Boucle for-in

La boucle for-in est utilisée pour itérer sur les propriétés d'un objet ou sur les indices d'un tableau dans l'ordre.

1let car = { brand: "Toyota", model: "Corolla", year: 2020 };
2
3for (let key in car) {
4    console.log(key + ": " + car[key]);
5}
6// Outputs:
7// brand: Toyota
8// model: Corolla
9// year: 2020

Exemple 4 : Boucle for-of

La boucle for-of est utilisée pour obtenir la valeur de chaque élément dans l'ordre à partir d'objets itérables tels que les tableaux ou les chaînes.

1let colors: string[] = ["red", "green", "blue"];
2
3for (let color of colors) {
4    console.log("Color: " + color);
5}
6// Outputs:
7// Color: red
8// Color: green
9// Color: blue

Exemple 5 : Boucle for imbriquée

Il est également possible d'utiliser une boucle for à l'intérieur d'une autre boucle for, appelée boucle imbriquée. Ceci permet de créer des boucles doubles, entre autres.

 1for (let i = 0; i < 3; i++) {
 2    console.log("Outer loop i: " + i);
 3    for (let j = 0; j < 2; j++) {
 4        console.log("  Inner loop j: " + j);
 5    }
 6}
 7// Outputs:
 8// Outer loop i: 0
 9//   Inner loop j: 0
10//   Inner loop j: 1
11// Outer loop i: 1
12//   Inner loop j: 0
13//   Inner loop j: 1
14// Outer loop i: 2
15//   Inner loop j: 0
16//   Inner loop j: 1

Résumé

• L'instruction for effectue un traitement répétitif basé sur des comptes ou des conditions spécifiés.
• for-in est utilisé pour récupérer les propriétés d'un objet ou les indices d'un tableau.
• for-of récupère les valeurs des éléments à partir d'objets itérables comme les tableaux.
• Un traitement répétitif complexe est également possible avec des boucles for imbriquées.

L'instruction for en TypeScript offre un traitement répétitif puissant et flexible, similaire aux autres boucles.

Les instructions While en TypeScript

En TypeScript, une instruction while est une structure de boucle qui exécute un processus répétitif tant que la condition spécifiée est true. Semblable à la boucle for, la boucle while est adaptée aux cas où le nombre d'itérations n'est pas prédéterminé, ou lorsque vous souhaitez contrôler la répétition en fonction d'une condition.

Syntaxe de base

1while (condition) {
2    // Code to execute repeatedly while the condition is true
3}

• Condition : La condition sous laquelle la boucle s'exécute. La boucle continue tant que cette condition est true, et s'arrête lorsqu'elle devient false.

Exemple 1 : Boucle de base while

Dans l'exemple ci-dessous, cela continue à afficher la valeur de i tant que i est inférieur à 5.

 1let i: number = 0;
 2
 3while (i < 5) {
 4    console.log("The value of i is: " + i);
 5    i++;
 6}
 7// Outputs:
 8// The value of i is: 0
 9// The value of i is: 1
10// The value of i is: 2
11// The value of i is: 3
12// The value of i is: 4

Dans cet exemple, la boucle se termine lorsque i devient 5 ou plus, car la condition devient false.

Exemple 2 : Exemple de boucle infinie

Si la condition dans une boucle while est toujours true, elle peut devenir une boucle infinie. Cela empêche généralement le programme de s'arrêter comme prévu, il faut donc faire preuve de prudence.

 1let x: number = 0;
 2
 3while (true) {
 4    console.log("The value of x is: " + x);
 5    x++;
 6    if (x >= 5) {
 7        break; // Exit the loop when the condition is met
 8    }
 9}
10// Outputs:
11// The value of x is: 0
12// The value of x is: 1
13// The value of x is: 2
14// The value of x is: 3
15// The value of x is: 4

Vous pouvez utiliser l'instruction break pour forcer la sortie de la boucle lorsqu'une condition est remplie.

Exemple 3 : Boucle do-while

La boucle do-while est une structure où le processus de boucle est exécuté au moins une fois. Étant donné que la condition est évaluée après le processus, celui-ci s'exécute au moins une fois même si la condition est false.

1let j: number = 5;
2
3do {
4    console.log("The value of j is: " + j);
5    j++;
6} while (j < 5);
7// Outputs: The value of j is: 5

Dans cet exemple, j vaut 5 dès le départ, et j < 5 est false, mais dans une boucle do-while, le processus s'exécute au moins une fois, quelle que soit la condition.

Résumé

• Une boucle while répète le traitement tant que la condition est true.
• Si la condition de fin de la boucle n'est pas claire, il faut être prudent avec les boucles infinies.
• Une boucle do-while diffère d'une boucle while normale en ce sens que le traitement est exécuté au moins une fois.

L'instruction while en TypeScript est utile pour traiter des boucles avec un nombre d'itérations incertain ou lorsque la vérification dynamique des conditions est nécessaire.

break et continue

Vous pouvez utiliser break et continue dans les boucles.

• break est utilisé pour terminer une boucle prématurément.
• continue est utilisé pour ignorer l'itération en cours et passer à l'itération suivante.

Exemple de break

 1for (let i = 0; i < 10; i++) {
 2    if (i === 5) {
 3        break;  // Exits the loop when i is 5
 4    }
 5    console.log(i);
 6}
 7// Outputs 0, 1, 2, 3, 4
 8
 9let i = 0;
10
11while (i < 10) {
12    if (i === 5) {
13        break;  // Ends the loop when i is 5
14    }
15    console.log(i++);
16}
17// Outputs 0, 1, 2, 3, 4

Dans ce cas, break est exécuté lorsque i devient 5. En conséquence, les nombres de 0 à 4 sont affichés.

Exemple de continue

 1for (let i = 0; i < 5; i++) {
 2    if (i === 2) {
 3        continue;  // Skips when i is 2
 4    }
 5    console.log(i);
 6}
 7// Outputs 0, 1, 3, 4
 8
 9let i = 0;
10
11while (i < 5) {
12    i++;
13    if (i === 3) {
14        continue;  // Skips when i is 3
15    }
16    console.log(i);
17}
18// Outputs 1, 2, 4, 5

Dans ce cas, continue est exécuté lorsque i est 2. En conséquence, les nombres sauf 2 sont affichés.

Boucles imbriquées en TypeScript

Une boucle imbriquée est une structure où une boucle est utilisée à l'intérieur d'une autre boucle. En TypeScript, des constructions de boucle comme for, while et do-while sont supportées. En utilisant des boucles imbriquées, vous pouvez traiter des tableaux bidimensionnels (matrices) et rationaliser le traitement en fonction de plusieurs conditions.

Syntaxe de base

La syntaxe de base d'une boucle imbriquée est la suivante.

1for (let i: number = 0; i < n; i++) {
2  for (let j: number = 0; j < m; j++) {
3    // Processing for the inner loop
4  }
5}

Pour chaque exécution de la boucle externe, la boucle interne effectue toutes ses itérations. Cette structure est très utile pour gérer plusieurs boucles ou structures de données.

Exemple de boucle imbriquée en TypeScript

Parcours d'un tableau bidimensionnel

Les boucles imbriquées sont souvent utilisées pour manipuler des structures de données multidimensionnelles comme les tableaux bidimensionnels. Dans l'exemple suivant, les éléments d'un tableau bidimensionnel sont parcourus et leurs valeurs sont affichées sur la console.

 1const matrix: number[][] = [
 2  [1, 2, 3],
 3  [4, 5, 6],
 4  [7, 8, 9]
 5];
 6
 7for (let row: number = 0; row < matrix.length; row++) {
 8  for (let col: number = 0; col < matrix[row].length; col++) {
 9    console.log(`matrix[${row}][${col}] = ${matrix[row][col]}`);
10  }
11}
12// Output
13// matrix[0][0] = 1
14// matrix[0][1] = 2
15// matrix[0][2] = 3
16// matrix[1][0] = 4
17// matrix[1][1] = 5
18// matrix[1][2] = 6
19// matrix[2][0] = 7
20// matrix[2][1] = 8
21// matrix[2][2] = 9

Dans cet exemple, nous parcourons le tableau bidimensionnel matrix. La boucle externe gère les lignes et la boucle interne gère les colonnes, affichant chaque élément dans l'ordre.

Combinaison de deux tableaux

Ensuite, nous introduisons un exemple de calcul de toutes les combinaisons de deux tableaux. Par exemple, vous pouvez prendre un élément de chacun des deux tableaux et afficher toutes les paires possibles.

 1const array1: string[] = ['A', 'B', 'C'];
 2const array2: number[] = [1, 2, 3];
 3
 4for (let i: number = 0; i < array1.length; i++) {
 5  for (let j: number = 0; j < array2.length; j++) {
 6    console.log(`Pair: (${array1[i]}, ${array2[j]})`);
 7  }
 8}
 9// Output
10// Pair: (A, 1)
11// Pair: (A, 2)
12// Pair: (A, 3)
13// Pair: (B, 1)
14// Pair: (B, 2)
15// Pair: (B, 3)
16// Pair: (C, 1)
17// Pair: (C, 2)
18// Pair: (C, 3)

Dans cet exemple, toutes les paires entre le tableau de chaînes de caractères array1 et le tableau de nombres array2 sont créées. La boucle externe extrait des éléments de array1, et la boucle interne extrait des éléments de array2, affichant chaque paire.

Génération de coordonnées avec une triple boucle

En utilisant des boucles imbriquées triples, vous pouvez par exemple générer des coordonnées dans un espace tridimensionnel.

 1for (let x: number = 0; x < 3; x++) {
 2  for (let y: number = 0; y < 3; y++) {
 3    for (let z: number = 0; z < 3; z++) {
 4      console.log(`Coordinate: (${x}, ${y}, ${z})`);
 5    }
 6  }
 7}
 8// Output
 9// Coordinate: (0, 0, 0)
10// Coordinate: (0, 0, 1)
11// Coordinate: (0, 0, 2)
12// ...
13// Coordinate: (2, 2, 1)
14// Coordinate: (2, 2, 2)

De cette manière, l'utilisation de boucles imbriquées triples permet de générer facilement des coordonnées dans un espace tridimensionnel.

Performance des boucles imbriquées

Les boucles imbriquées sont pratiques, mais le coût computationnel augmente rapidement avec la profondeur des boucles. Par exemple, s'il y a n itérations de la boucle externe et m itérations de la boucle interne, le nombre total d'itérations sera de n * m. Lorsque cela devient encore plus imbriqué, la complexité computationnelle augmente de manière exponentielle, ce qui peut affecter la performance du programme.

Voici les complexités computationnelles lors du parcours de trois tableaux.

 1const array1: number[] = [1, 2, 3];
 2const array2: number[] = [4, 5, 6];
 3const array3: number[] = [7, 8, 9];
 4
 5for (let i: number = 0; i < array1.length; i++) {
 6  for (let j: number = 0; j < array2.length; j++) {
 7    for (let k: number = 0; k < array3.length; k++) {
 8      console.log(`Combination: (${array1[i]}, ${array2[j]}, ${array3[k]})`);
 9    }
10  }
11}

Dans ce cas, vous devez calculer array1.length * array2.length * array3.length, ce qui donne 3 * 3 * 3 = 27 itérations pour traiter toutes les combinaisons.

Optimisation des boucles imbriquées

Lors de l'utilisation de boucles imbriquées, vous pouvez améliorer les performances en prenant en compte les optimisations suivantes :.

1. Introduire des retours anticipés : Quittez la boucle dès que l'objectif est atteint pour éviter des itérations inutiles.
2. Mettre en cache les variables de boucle : Pré-mémorisez les valeurs des variables utilisées dans la boucle (en particulier les longueurs et les plages) pour réduire le coût des calculs à chaque itération.
3. Modifier les structures de données : Réviser la structure des tableaux et des objets peut être efficace pour accélérer certains processus répétitifs.

Conclusion

Les boucles imbriquées sont un outil puissant pour le traitement de données complexes et les algorithmes. Cependant, à mesure que la profondeur des boucles et le nombre d'itérations augmentent, des problèmes de performance peuvent survenir. Avec des optimisations appropriées et une conception soignée, vous pouvez exploiter efficacement les boucles imbriquées dans TypeScript.

Vous pouvez suivre l'article ci-dessus avec Visual Studio Code sur notre chaîne YouTube. Veuillez également consulter la chaîne YouTube.

YouTube Video