TOC

Comment utiliser l’instruction Switch en JavaScript

introduction

Les instructions conditionnelles font partie des fonctionnalités les plus utiles et les plus communes de tous les langages de programmation. “https://www.digitalocean.com/community/tutorials/how-to-write-conditional-statements-in-javascript[How To Write Conditional Statements in JavaScript]” describes how to use the if, else, and else if keywords to control the flow of a program based on different conditions, which in JavaScript are often the result of user input.

En plus deif...else, JavaScript possède une fonctionnalité appelée instructionswitch. switch est un type d'instruction conditionnelle qui évaluera une expression par rapport à plusieurs cas possibles et exécutera un ou plusieurs blocs de code en fonction des cas correspondants. L'instructionswitch est étroitement liée à une instruction conditionnelle contenant de nombreux blocselse if, et ils peuvent souvent être utilisés de manière interchangeable.

Dans ce didacticiel, nous allons apprendre à utiliser l'instructionswitch, ainsi qu'à utiliser les mots-clés associéscase,break etdefault. Enfin, nous verrons comment utiliser plusieurs cas dans une instructionswitch.

Commutateur

L'instructionswitch évalue une expression et exécute le code à la suite d'un cas correspondant. Au début, cela peut sembler un peu intimidant, mais la syntaxe de base est similaire à celle d'une instructionif. Il sera toujours écrit avecswitch () {}, avec des parenthèses contenant l'expression à tester et des accolades contenant le code potentiel à exécuter.

Vous trouverez ci-dessous un exemple d'instructionswitch avec deux instructionscase, et une instruction de secours appeléedefault. 

switch (expression) {
    case x:
        // execute case x code block
        break;
    case y:
        // execute case y code block
        break;
    default:
        // execute default code block
}

Suivant la logique du bloc de code ci-dessus, il s'agit de la séquence d'événements qui se déroulera.

  • L'expression est évaluée

  • Les premierscase,x, seront testés par rapport à l'expression. S'il correspond, le code s'exécutera et le mot clébreak terminera le blocswitch.

  • S'il ne correspond pas,x sera ignoré et le casy sera testé par rapport à l'expression. Siy correspond à l'expression, le code s'exécutera et sortira du blocswitch.

  • Si aucun des cas ne correspond, le bloc de codedefault s'exécutera.

Faisons un exemple fonctionnel d'une instructionswitch suivant la syntaxe ci-dessus. Dans ce bloc de code, nous trouverons le jour courant de la semaine avec la méthodenew Date(), etgetDay() pour imprimer un nombre correspondant au jour courant. 1 signifie lundi, tout au long de7 qui signifie dimanche. Nous allons commencer par configurer notre variable. 

const day = new Date().getDay();

En utilisantswitch, nous enverrons un message à la console chaque jour de la semaine. Le programme s'exécutera dans l'ordre de haut en bas à la recherche d'une correspondance, et une fois qu'elle est trouvée, la commandebreak empêchera le blocswitch de continuer à évaluer les instructions.

week.js

// Set the current day of the week to a variable, with 1 being Monday and 7 being Sunday
const day = new Date().getDay();

switch (day) {
    case 1:
        console.log("Happy Monday!");
        break;
    case 2:
        console.log("It's Tuesday. You got this!");
        break;
    case 3:
        console.log("Hump day already!");
        break;
    case 4:
        console.log("Just one more day 'til the weekend!");
        break;
    case 5:
        console.log("Happy Friday!");
        break;
    case 6:
        console.log("Have a wonderful Saturday!");
        break;
    case 7:
        console.log("It's Sunday, time to relax!");
        break;
    default:
        console.log("Something went horribly wrong...");
}
Output'Just one more day 'til the weekend!'

Ce code a été testé un jeudi, ce qui correspond à4, donc la sortie de la console étaitJust one more day 'til the weekend!. Selon le jour de la semaine où vous testez le code, votre sortie sera différente. Nous avons inclus un blocdefault à la fin pour s'exécuter en cas d'erreur, ce qui dans ce cas ne devrait pas se produire car il n'y a que 7 jours par semaine. Nous pourrions aussi avoir, par exemple, uniquement des résultats imprimés du lundi au vendredi, et le blocdefault aurait pu avoir le même message pour le week-end.

Si nous avions omis le mot-clébreak dans chaque instruction, aucune des autres instructionscase n'aurait été évaluée à vrai, mais le programme aurait continué à vérifier jusqu'à ce qu'il atteigne la fin. Afin de rendre nos programmes plus rapides et plus efficaces, nous incluons lesbreak.

Plage de commutation

Il se peut que vous deviez évaluer une plage de valeurs dans un blocswitch, par opposition à une seule valeur comme dans notre exemple ci-dessus. Nous pouvons le faire en définissant notre expression surtrue et en effectuant une opération dans chaque instructioncase.

Pour rendre cela plus facile à comprendre, nous allons utiliser un exemple familier. Dans le didacticielconditional statements, nous avons créé une application de notation simple qui prendrait un score numérique et le convertirait en note lettre, avec les exigences suivantes.

  • Une note de 90 et plus est unA

  • La note de 80 à 89 est unB

  • La note de 70 à 79 est unC

  • La note de 60 à 69 est unD

  • Une note de 59 ou moins est unF

Maintenant, nous pouvons écrire cela comme une instructionswitch. Puisque nous vérifions une plage, nous allons effectuer l'opération dans chaquecase pour vérifier si chaque expression est évaluée àtrue, puis sortir de l'instruction une fois que les exigences pourtrue ont été satisfait.

grades.js

// Set the student's grade
const grade = 87;

switch (true) {
    // If score is 90 or greater
    case grade >= 90:
        console.log("A");
        break;
    // If score is 80 or greater
    case grade >= 80:
        console.log("B");
        break;
    // If score is 70 or greater
    case grade >= 70:
        console.log("C");
        break;
    // If score is 60 or greater
    case grade >= 60:
        console.log("D");
        break;
    // Anything 59 or below is failing
    default:
        console.log("F");
}
Output'B'

L'expression entre parenthèses à évaluer esttrue dans cet exemple. Cela signifie que toutcase évalué àtrue sera une correspondance.

Tout comme avecelse if,switch est évalué de haut en bas, et la première vraie correspondance sera acceptée. Par conséquent, même si notre variablegrade est87 et s'évalue donc également àtrue pour C et D, la première correspondance est B, qui sera la sortie.

Plusieurs cas

Vous pouvez rencontrer du code dans lequel plusieurscase+`s should have the same output. In order to accomplish this, you can use more than one `+case pour chaque bloc de code.

Afin de tester cela, nous allons faire une petite application faisant correspondre le mois en cours à la saison appropriée. Tout d'abord, nous allons utiliser la méthodenew Date() pour trouver un nombre correspondant au mois en cours, et l'appliquer à la variablemonth. 

const month = new Date().getMonth();

La méthodenew Date().getMonth() affichera un nombre de0 à11,0 étant janvier et11 décembre. Au moment de cette publication, le mois est septembre, qui correspondra à8.

Notre application produira les quatre saisons avec les spécifications suivantes pour plus de simplicité:

  • Winter: janvier, février et mars

  • Spring: avril, mai et juin

  • Summer: juillet, août et septembre

  • Autumn: octobre, novembre et décembre

Vous trouverez ci-dessous notre code.

seasons.js

// Get number corresponding to the current month, with 0 being January and 11 being December
const month = new Date().getMonth();

switch (month) {
    // January, February, March
    case 0:
    case 1:
    case 2:
        console.log("Winter");
        break;
    // April, May, June
    case 3:
    case 4:
    case 5:
        console.log("Spring");
        break;
    // July, August, September
    case 6:
    case 7:
    case 8:
        console.log("Summer");
        break;
    // October, November, December
    case 9:
    case 10:
    case 11:
        console.log("Autumn");
        break;
    default:
        console.log("Something went wrong.");
}

Lorsque nous exécutons le code, nous recevons une sortie identifiant la saison en cours en fonction des spécifications ci-dessus. 

OutputSummer

Le mois en cours au moment de la publication était8, ce qui correspondait à l'un des énoncéscase avec la sortie de la saison"Summer".

Conclusion

Dans cet article, nous avons examiné l'instructionswitch, un type deconditonal statement qui évalue une expression et génère différentes valeurs en fonction des résultats correspondants. Nous avons examiné les instructionsswitch en utilisant une plage et plusieurs instructionscase.

Pour en savoir plus surswitch, vous pouvez le consulter sur leMozilla Developer Network.

Related