JavaScript - Switch Case: A Guide for Beginners

Salut là, futur superstar du codage ! Prêt à découvrir une des outils de prise de décision les plus cool de JavaScript ? Attache-toi, car on va plonger dans le merveilleux monde des instructions Switch Case !

JavaScript - Switch Case

Qu'est-ce que le Switch Case ?

Avant de rentrer dans les détails, commencerons par une simple analogie. Imagine que tu es dans une crèmerie, et que tu dois choisir un parfum de glace. Tu pourrais utiliser un tas de conditions "if-else" pour décider, mais ce serait comme demander au serveur : "C'est de la vanille ? Non ? C'est du chocolat ? Non ? C'est de la fraise ?" et ainsi de suite. Ne serait-il pas plus simple de dire : "Quel parfum c'est ?" et de choisir en fonction de la réponse ? C'est exactement ce que fait le Switch Case !

Diagramme de flux

Pour visualiser comment fonctionne le Switch Case, regardons un diagramme de flux :

[Début]
|
v
[Vérifier l'expression]
|
______|_______
|      |       |
v      v       v
[Case 1][Case 2][Case 3]...
|      |       |
v      v       v
[Action 1][Action 2][Action 3]...
|      |       |
|______|_______|
|
v
[Par défaut]
|
v
[Fin]

Ce diagramme de flux montre comment le Switch Case évalue une expression puis exécute le bloc de cas correspondant. Si aucune correspondance n'est trouvée, il exécute le bloc par défaut (si fourni).

Syntaxe

Maintenant, analysons la syntaxe d'une instruction Switch Case :

switch(expression) {
case value1:
// code à exécuter
break;
case value2:
// code à exécuter
break;
case value3:
// code à exécuter
break;
...
default:
// code à exécuter si aucun cas ne correspond
}

Voici ce que signifie chaque partie :

  • switch(expression): C'est où nous mettons la valeur que nous voulons vérifier.
  • case value: Ce sont les valeurs possibles correspondant à l'expression.
  • // code à exécuter: C'est ce qui se passe si le cas correspond.
  • break: Ce mot-clé indique à JavaScript de quitter le bloc switch après avoir exécuté le cas correspondant.
  • default: C'est comme le "else" dans une instruction if-else. Il s'exécute si aucun cas ne correspond.

Exemples

Plongeons dans quelques exemples pour voir le Switch Case en action !

Exemple 1 : Les jours de la semaine

let day = 3;
let dayName;

switch (day) {
case 1:
dayName = "Monday";
break;
case 2:
dayName = "Tuesday";
break;
case 3:
dayName = "Wednesday";
break;
case 4:
dayName = "Thursday";
break;
case 5:
dayName = "Friday";
break;
case 6:
dayName = "Saturday";
break;
case 7:
dayName = "Sunday";
break;
default:
dayName = "Invalid day";
}

console.log(dayName); // Output: Wednesday

Dans cet exemple, nous utilisons le Switch Case pour convertir un numéro de jour en son nom correspondant. Voici ce qui se passe :

  1. Nous définissons day comme 3.
  2. L'instruction switch vérifie la valeur de day.
  3. Elle trouve une correspondance dans case 3.
  4. Elle définit dayName comme "Wednesday".
  5. L'instruction break quitte le bloc switch.
  6. Enfin, nous affichons dayName dans la console.

Exemple 2 : Système de notation

Créons un système de notation simple :

let grade = 'B';
let message;

switch(grade) {
case 'A':
message = "Excellent job!";
break;
case 'B':
message = "Great work!";
break;
case 'C':
message = "Good effort!";
break;
case 'D':
message = "You need to study more.";
break;
case 'F':
message = "Please see me after class.";
break;
default:
message = "Invalid grade";
}

console.log(message); // Output: Great work!

Dans cet exemple :

  1. Nous définissons grade comme 'B'.
  2. L'instruction switch vérifie la valeur de grade.
  3. Elle trouve une correspondance dans case 'B'.
  4. Elle définit message comme "Great work!".
  5. L'instruction break quitte le bloc switch.
  6. Nous affichons message dans la console.

Exemple 3 : Cas multiples

Parfois, vous pouvez vouloir que différents cas aient le même résultat. Voici comment vous pouvez le faire :

let fruit = "apple";
let category;

switch(fruit) {
case "apple":
case "pear":
case "banana":
category = "common fruit";
break;
case "mango":
case "papaya":
category = "tropical fruit";
break;
default:
category = "unknown fruit";
}

console.log(category); // Output: common fruit

Dans cet exemple :

  1. Nous définissons fruit comme "apple".
  2. L'instruction switch vérifie la valeur de fruit.
  3. Elle trouve une correspondance dans le premier case "apple".
  4. Puisque il n'y a pas d'instruction break, il continue à la ligne suivante.
  5. Il définit category comme "common fruit".
  6. L'instruction break quitte alors le bloc switch.

Méthodes liées au Switch Case

Voici un tableau des méthodes liées au Switch Case et de leurs descriptions :

Méthode Description
switch Démarre une instruction switch
case Définit un cas dans l'instruction switch
break Quitte le bloc switch
default Définit le cas par défaut si aucun autre cas ne correspond

N'oubliez pas, le Switch Case permet de rendre votre code plus lisible et efficace lorsque vous avez plusieurs conditions à vérifier. C'est comme un régulateur de trafic, dirigeant votre code vers le bon endroit en fonction d'une valeur spécifique.

Alors, voilà ! Vous êtes maintenant équipé de la puissance du Switch Case. Souvenez-vous, la pratique rend parfait, donc essayez de créer vos propres instructions Switch Case. Peut-être faire un jeu amusant où des choix différents mènent à des résultats différents. Les possibilités sont infinies !

Bon codage, et que le Switch soit avec vous ! ??

Credits: Image by storyset