EPUB/PDF
FR
→ JavaScript le language → Fondamentaux JavaScript
21 octobre 2022
La déclaration "switch"
Une instruction switch peut remplacer plusieurs vérification if .
Cela donne un moyen plus descriptif de comparer une valeur avec plusieurs variantes.
La syntaxe
Le switch a un ou plusieurs blocs case (cas) et une valeur par défaut facultative.
Cela ressemble à ceci :
1 switch(x) {
2 case 'value1': // si (x === 'value1')
3 ...
4 [break]
5
6 case 'value2': // si (x === 'value2')
7 ...
8 [break]
9
10 default:
11 ...
12 [break]
13 }
● La valeur de x est vérifiée pour une égalité stricte avec la valeur du premier case (c’est-à-dire, value1 ),
puis du second ( value2 ) et ainsi de suite.
● Si l’égalité est trouvée, switch commence à exécuter le code à partir du case correspondant, jusqu’au
prochain break (ou jusqu’à la fin du switch).
● Si aucun cas ne correspond, le code par défaut ( default ) est exécuté (s’il existe).
Un exemple
Un exemple de switch (le code exécuté est mis en évidence) :
1 let a = 2 + 2;
2
3 switch (a) {
4 case 3:
5 alert( 'Too small' );
6 break;
7 case 4:
8 alert( 'Exactly!' );
9 break;
10 case 5:
11 alert( 'Too big' );
12 break;
13 default:
14 alert( "I don't know such values" );
15 }
Ici, le switch commence à comparer a avec le premier case dont la valeur est 3 . La correspondance
échoue.
Ensuite 4 , c’est une correspondance. L’exécution commence donc à partir du case 4 jusqu’au prochain
break .
S’il n’y a pas de break , l’exécution continue avec le case suivant sans aucun contrôle.
Un exemple sans break :
1 let a = 2 + 2;
2
3 switch (a) {
4 case 3:
5 alert( 'Too small' );
6 case 4:
7 alert( 'Exactly!' );
8 case 5:
9 alert( 'Too big' );
10 default:
11 alert( "I don't know such values" );
12 }
Dans l’exemple ci-dessus, nous verrons l’exécution séquentielle de trois alert :
1 alert( 'Exactly!' );
2 alert( 'Too big' );
3 alert( "I don't know such values" );
Toute expression peut être un argument switch/case
Switch et case permettent des expressions arbitraires.
Par exemple :
1 let a = "1";
2 let b = 0;
3
4 switch (+a) {
5 case b + 1:
6 alert("this runs, because +a is 1, exactly equals b+1");
7 break;
8
9 default:
10 alert("this doesn't run");
11 }
Ici +a donne 1 , qui est comparé à b + 1 dans le case , et le code correspondant est exécuté.
Groupement de “case”
Plusieurs variantes de case partageant le même code peuvent être regroupées.
Par exemple, si nous voulons que le même code soit exécuté pour les case 3 et case 5 :
1 let a = 2 + 2;
2
3 switch (a) {
4 case 4:
5 alert('Right!');
6 break;
7
8 case 3: // (*) grouped two cases
9 case 5:
10 alert('Wrong!');
11 alert("Why don't you take a math class?");
12 break;
13
14 default:
15 alert('The result is strange. Really.');
16 }
Maintenant, les 3 et 5 affichent le même message.
La possibilité de “grouper” les case est un effet secondaire de la façon dont le switch/case fonctionne sans
break . Ici, l’exécution du case 3 commence à partir de la ligne (*) et passe par le case 5 , car il n’ya pas
de break .
Le type compte
Soulignons que le contrôle d’égalité est toujours strict. Les valeurs doivent être du même type pour
correspondre.
Par exemple, considérons le code suivant :
1 let arg = prompt("Enter a value?");
2 switch (arg) {
3 case '0':
4 case '1':
5 alert( 'One or zero' );
6 break;
7
8 case '2':
9 alert( 'Two' );
10 break;
11
12 case 3:
13 alert( 'Never executes!' );
14 break;
15 default:
16 alert( 'An unknown value' );
17 }
1. Pour 0 , 1 , la première alert est exécutée.
2. Pour 2 , la deuxième alert est exécutée.
3. Mais pour 3 , le résultat du prompt est une chaîne de caractères "3" , ce qui n’est pas strictement égal ===
au chiffre 3 . Nous avons donc un code mort dans le case 3 ! La variante par défaut sera donc exécutée.
Exercices
Réécrire le "switch" dans un "if"
importance: 5
Écrivez le code en utilisant if..else qui correspondrait au switch suivant :
1 switch (browser) {
2 case 'Edge':
3 alert( "You've got the Edge!" );
4 break;
5
6 case 'Chrome':
7 case 'Firefox':
8 case 'Safari':
9 case 'Opera':
10 alert( 'Okay we support these browsers too' );
11 break;
12
13 default:
14 alert( 'We hope that this page looks ok!' );
15 }
solution
Réécrire le "if" dans un "switch"
importance: 4
Réécrivez le code ci-dessous en utilisant une seule instruction switch :
1 let a = +prompt('a?', '');
2
3 if (a == 0) {
4 alert( 0 );
5 }
6 if (a == 1) {
7 alert( 1 );
8 }
9
10 if (a == 2 || a == 3) {
11 alert( '2,3' );
12 }
solution
Cours précédent Prochain cours
Partager Carte du tutoriel
Commentaires
● Si vous avez des améliorations à suggérer, merci de soumettre une issue GitHub ou une pull request
au lieu de commenter.
● Si vous ne comprenez pas quelque chose dans l'article, merci de préciser.
● Pour insérer quelques bouts de code, utilisez la balise <code> , pour plusieurs lignes – enveloppez-les
avec la balise <pre> , pour plus de 10 lignes - utilisez une sandbox (plnkr, jsbin, codepen…)
© 2007—2023 Ilya Kantorà propos du projet
nous contacter
