Comprendre l'instruction Switch en Javascript

Comprendre l'instruction Switch en Javascript

Dans cet article, vous allez découvrir ce qu'est l'instruction Switch en Javascript et comment l'utiliser.

L'instruction JavaScript Switch est utilisée lorsque vous souhaitez exécuter conditionnellement du code.

Au même titre que if...else, l'instruction Switch permet d'exécuter du code en fonction de certaines conditions.

L'instruction Switch évalue une expression et exécute le code correspondant au résultat de l'expression.

Instruction Switch en JS

La syntaxe de l'instruction switch est la suivante :

switch(variable) {
    case valeur1:  
        // s'exécute si la valeur 1 est true
        break;

    case valeur2:  
         // s'exécute si la valeur 2 est true
        break;

    case valeurN:
        // s'exécute si la valeur N est true
        break;

    default:
        // si aucune valeur n'est true alors exécute cette partie
}

L'instruction switch évalue une variable/expression entre parenthèses.

  • Si le résultat de l'expression est égal à la valeur 1, son corps est exécuté.
  • Si le résultat de l'expression est égal à la valeur 2, le corps de l'instruction est exécuté.
  • Ce processus se poursuit. S'il n'y a pas de cas correspondant, le corps par défaut est exécuté.

À noter :

  • L'instruction break est facultative. Si l'instruction break est rencontrée, l'instruction switch se termine.
  • Si l'instruction break n'est pas utilisée, les cas qui suivent le cas correspondant sont également exécutés.
  • La clause default est également facultative.
  • Il est impossible d'utiliser les opérateurs logiques dans l'instruction switch contrairement à if...else

L'instruction Switch groupée en Javascript

Dans une instruction switch, vous pouvez si vous le souhaitez, grouper vos cases ensemble afin d'exécuter une seule partie de code. Cela évite de répéter le code plusieurs fois.

De manière générale, la plupart des développeurs web adoptent le DRY Don't Repeat Yourself autant que possible. Il faut donc essayer d'optimiser son code au mieux d'où ce cas d'usage.

Voici un cas d'usage du switch case groupé en JS :

switch(variable) {
    case valeur1:  
    case valeur2:  
    case valeurN:
        // s'exécute pour les 3 cases précédents valeur1, valeur2 et valeurN
        break;

    default:
        // si aucune valeur n'est true alors exécute cette partie
}

Exemple d'utilisation de l'instruction Switch en Javascript

Dans cette partie, nous allons simplement voir ensemble un cas d'usage de l'instruction Switch en JS.

Imaginons que vous souhaitez afficher un message différent en fonction d'une note obtenue.

let note = 9

switch(note) {
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:  
        alert('Mauvaise note');
        break;
    case 6:
    case 7:
    case 8:
    case 9:
    case 10:
        alert('Bonne note');
        break;
    default:
       alert('Note inconnue')
}
// Affiche Bonne note

Dans cet exemple, nous avons déclaré une variable note et assigné une valeur de 9.

Grâce à l'instruction Switch et notamment en groupant les cases, nous avons pu afficher un message différent en fonction de la note assignée à la variable.

Ici le code affiche le résultat 'Bonne note'.

Voilà typiquement un cas d'usage intéressant pour Switch.