logo

TechCodeview

Instruction de commutateur JavaScript

Le Instruction de commutation JavaScript évalue une expression et exécute un bloc de code en fonction des cas correspondants. Il offre une alternative aux longues chaînes if-else, améliorant la lisibilité et la maintenabilité, en particulier lors de la gestion de plusieurs branches conditionnelles.

Table des matières

Syntaxe de l'instruction Switch 

switch (expression) {  case value1:  // code block 1;  break;  case value2:  // code block 2;  break;  ...  default:  // default code block; }>
  • Expression> est la valeur que vous souhaitez comparer.
  • Case value1>,case value2>, etc., représentent les valeurs possibles duexpression>.
  • break>La déclaration met fin à laswitch>déclaration. Sans cela, l'exécution se poursuivra dans l'affaire suivante.
  • Default>spécifie le code à exécuter si aucun des cas ne correspond auexpression>.

Comment fonctionne l'instruction Switch

  • Évaluation : L'expression à l'intérieur duswitch>la déclaration est évaluée une fois.
  • Comparaison : La valeur de l'expression est comparée à chaquecase>label (en utilisant l'égalité stricte===>).
  • Exécution : Si une correspondance est trouvée, le bloc de code correspondant suivant la correspondancecase>l'étiquette est exécutée. Si aucune correspondance n'est trouvée, l'exécution passe audefault>cas (si présent) ou continue avec l'instruction suivante après leswitch>bloc.
  • Déclaration de rupture : Après avoir exécuté un bloc de code, lebreak>La déclaration met fin à laswitch>déclaration, empêchant l’exécution de se répercuter sur des affaires ultérieures. Sibreak>est omis, l'exécution se poursuivra jusqu'au cas suivant (appelé passage à niveau).
  • Cas par défaut : Ledefault>le cas est facultatif. Si aucune correspondance n'est trouvée, le bloc de code sousdefault>est exécuté.

Organigramme de l'instruction Switch



Exemple d'instruction Switch :

Ici, nous imprimerons le nom du jour le jour 3.

Javascript 
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>
Sortir 
Wednesday>

Explication:

  • Day>est réglé sur3>.
  • Leswitch>l'instruction évalueday>.
  • Depuisday>est3>, lecase 3>le bloc est exécuté, en attribuant'Wednesday'>àdayName>.
  • Lebreak>la déclaration met fin à laswitch>déclaration, empêchant l’exécution de se poursuivre dans d’autres affaires.

Exemple d'instruction Switch :

Ici, nous vérifierons notre note en utilisant un boîtier de commutation.

Javascript 
let grade = 'B'; let result; switch (grade) {  case 'A':  result = 'A (Excellent)';  break;  case 'B':  result = 'B (Average)';  break;  case 'C':  result = 'C (Below than average)';  break;  default:  result = 'No Grade'; } console.log(result);>
Sortir 
B (Average)>

Explication:

  • Grade>se voit attribuer la valeur'B'>.
  • Leswitch>l'instruction évalue la valeur degrade>.
  • Depuisgrade>est'B'>, le bloc de code suivantcase 'B':>est exécuté.
  • Leresult>la variable reçoit la chaîne'B (Average)'>.
  • Lebreak>La déclaration met fin à laswitch>déclaration.
  • result>est connecté à la console, qui affiche'B (Average)'>.

Casser le mot-clé

Lebreak>le mot-clé permet de terminer l'exécution d'une boucle ou d'unswitch>déclaration.

Mot-clé par défaut

Ledefault>le mot-clé est utilisé dans unswitch>comme option de secours lorsqu'aucun des élémentscase>les expressions correspondent à la valeur évaluée. Il agit de la même manière que leelse>déclaration dans unif...else>chaîne, fournissant une action par défaut à entreprendre lorsqu’aucun autre cas spécifique ne correspond.

La position du cas par défaut n'a pas d'importance :

Quel que soit son emplacement, le cas par défaut n'est exécuté que si aucune des autres conditions du cas n'est remplie. Ainsi, le placer au début, au milieu ou à la fin ne change pas la logique de base (sauf si vous utilisez une technique moins courante appelée fall-through).

nous imprimerons le cas par défaut.

Javascript 
let day = 8; let dayName; switch (day) {  default:  dayName = 'Invalid day';  break;  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;   } console.log(dayName);>
Sortir 
Invalid day>

Blocs de code courants

Dans certains cas, nous devons utiliser le même code pour plusieurs cas de commutation. Voyons un exemple de la façon de procéder :

Blocs de code courants Exemple:

Ici, nous allons les mêmes blocs de code pour deux cas de commutation différents.

Javascript 
let grade = 'A' let result; switch (grade) {  case 'A':  result = 'Grade is excellent'  break;  case 'B':  result = 'Grade is good'  break;  case 'C':  result = 'Grade is Average '  break;  case 'D':  result = 'Grade is Poor'  break;  default:  text = 'NO grades achieved'; } console.log(result)>
Sortir 
Grade is excellent>

Explication:

  • Grade>se voit attribuer la valeur'A'>.
  • Leswitch>l'instruction évalue la valeur degrade>.
  • Depuisgrade>allumettes'A'>, le bloc de code suivantcase 'A':>est exécuté, en définissantresult>à'Grade is excellent'>.
  • Lebreak>La déclaration met fin à laswitch>déclaration.
  • Result>est connecté à la console, qui affiche'Grade is excellent'>.

Note: Si plusieurs cas de commutation correspondent à une valeur, le premier est exécuté.