HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
All web technology
Learn web development
Discover our tools
Get to know MDN better
Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
View in English Always switch to English
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
L'instruction if…else exécute une instruction si une condition donnée est équivalente à vrai. Si la condition est équivalente à faux, ce sera l'instruction de la clause optionnelle else qui sera exécutée.
if…else
else
function testNum(a) { let result; if (a > 0) { result = "positive"; } else { result = "NOT positive"; } return result; } console.log(testNum(-5)); // Expected output: "NOT positive"
if (condition) instruction1 // Avec une clause else if (condition) instruction1 else instruction2
condition
Une expression qui sera évaluée pour déterminer si elle est équivalente à vrai (truthy en anglais) ou équivalente à faux (falsy en anglais).
instruction1
L'instruction qui est exécutée si la condition est équivalente à vrai. Cette instruction peut être n'importe quelle instruction valide, y compris une imbrication d'autres instructions if. Pour exécuter plusieurs instructions, on pourra utiliser un bloc d'instructions ({ /* … */ }) qui permet de les regrouper. Pour n'exécuter aucune instruction, on pourra utiliser l'instruction vide.
if
{ /* … */ }
instruction2
Si la clause else existe, ce sera l'instruction qui est exécutée si la condition est équivalente à faux. Comme pour la première, cette instruction peut être n'importe quelle instruction valide : une autre instruction if imbriquée, un bloc d'instruction, une instruction vide, etc.
Plusieurs instructions if…else peuvent être imbriquées afin de créer une structure else if (on notera qu'il n'y a pas de mot-clé elseif en JavaScript).
else if
elseif
if (condition1) instruction1 else if (condition2) instruction2 else if (condition3) instruction3 // … else instructionN
Si on indente correctement le code, on retrouve la structure exactement équivalente :
if (condition1) instruction1 else if (condition2) instruction2 else if (condition3) instruction3 // …
Afin d'exécuter plusieurs instructions, on utilisera un bloc d'instructions ({ /* … */ }) pour regrouper les instructions souhaitées.
if (condition) { instructions1; } else { instructions2; }
Ne pas utiliser de blocs d'instructions pourra causer des comportements déroutants, notamment si le code est formaté à la main. Prenons le fragment de code qui suit par exemple :
function verifierValeur(a, b) { if (a === 1) if (b === 2) console.log("a vaut 1 et b vaut 2"); else console.log("a ne vaut pas 1"); }
Ce code semble relativement innocent. Toutefois, si on exécute verifierValeur(1, 3), la console affichera "a ne vaut pas 1". En effet, la clause else sera connectée à la clause if la plus proche. Autrement dit, si le code ci-avant avait été correctement indenté, on aurait eu :
verifierValeur(1, 3)
Note : On appelle ceci le problème du dangling else.
De manière générale, c'est une bonne pratique que de toujours utiliser des blocs d'instructions, notamment si le code implique plusieurs if imbriqués.
function verifierValeur(a, b) { if (a === 1) { if (b === 2) { console.log("a vaut 1 et b vaut 2"); } } else { console.log("a ne vaut pas 1"); } }
Attention à ne pas confondre les valeurs booléennes primitives true et false avec les valeurs construites avec un objet Boolean (par exemple Boolean(false) et Boolean(true)). Toute valeur qui n'est pas false, undefined, null, 0, -0, NaN ou la chaîne vide (""), et tout objet, y compris un objet Boolean dont la valeur est false, seront considérés comme équivalent à true dans une instruction conditionnelle if. Ainsi :
true
false
Boolean
Boolean(false)
Boolean(true)
undefined
null
0
-0
NaN
""
const b = new Boolean(false); if (b) { console.log("b est équivalent à vrai"); // "b est équivalent à vrai" }
if (toto === titi) { resultat += increment; compteur++; } else { resultat += increment; }
Bien qu'il n'y ait pas de mot-clé elseif en JavaScript, il est possible d'imbriquer des instructions if…else à la suite les unes des autres en plaçant un espace entre else et le début de l'instruction if imbriquée :
if (x > 50) { // faire quelque chose } else if (x > 5) { // faire autre chose } else { // faire encore autre chose }
Il est conseillé de ne pas utiliser d'affectation au sein des expressions conditionnelles. En effet, l'affectation peut être confondue avec un test d'égalité lorsqu'on analyse le code. Il ne faut donc pas utiliser le code suivant (bien qu'il fonctionne) :
if (x = y) { // faire quelque chose }
Si vous devez affecter une variable de cette façon, la documentation sur l'instruction while contient une section sur l'affectation dans une condition et un exemple de la syntaxe à privilégier dans ces cas.
while
Activez JavaScript pour afficher ce tableau de compatibilité des navigateurs.
switch