if…else

BaselineWidely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

L'instructionif…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 optionnelleelse qui sera exécutée.

Exemple interactif

function testNum(a) {  let result;  if (a > 0) {    result = "positive";  } else {    result = "NOT positive";  }  return result;}console.log(testNum(-5));// Expected output: "NOT positive"

Syntaxe

if (condition)  instruction1// Avec une clause elseif (condition)  instruction1else  instruction2

condition: Uneexpression 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 instructionsif. Pour exécuter plusieurs instructions, on pourra utiliser unbloc d'instructions ({ /* … */ }) qui permet de les regrouper. Pour n'exécuter aucune instruction, on pourra utiliserl'instruction vide.
instruction2: Si la clauseelse 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 instructionif imbriquée, un bloc d'instruction, une instruction vide, etc.

Description

Plusieurs instructionsif…else peuvent être imbriquées afin de créer une structureelse if (on notera qu'il n'y a pas de mot-cléelseif en JavaScript).

if (condition1)  instruction1else if (condition2)  instruction2else if (condition3)  instruction3// …else  instructionN

Si on indente correctement le code, on retrouve la structure exactement équivalente :

if (condition1)  instruction1else  if (condition2)    instruction2  else    if (condition3)      instruction3// …

Afin d'exécuter plusieurs instructions, on utilisera unbloc 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écuteverifierValeur(1, 3), la console affichera "a ne vaut pas 1". En effet, la clauseelse sera connectée à la clauseif la plus proche. Autrement dit, si le code ci-avant avait été correctement indenté, on aurait eu :

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");}

Note :On appelle cecile problème dudangling 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 plusieursif 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 primitivestrue etfalse avec les valeurs construites avec un objetBoolean (par exempleBoolean(false) etBoolean(true)). Toute valeur qui n'est pasfalse,undefined,null,0,-0,NaN ou la chaîne vide (""), et tout objet, y compris un objetBoolean dont la valeur estfalse, seront considérés comme équivalent àtrue dans une instruction conditionnelleif. Ainsi :

const b = new Boolean(false);if (b) {  console.log("b est équivalent à vrai"); // "b est équivalent à vrai"}

Exemples

Utiliser`if…else`

if (toto === titi) {  resultat += increment;  compteur++;} else {  resultat += increment;}

Utiliser`else if`

Bien qu'il n'y ait pas de mot-cléelseif en JavaScript, il est possible d'imbriquer des instructionsif…else à la suite les unes des autres en plaçant un espace entreelse et le début de l'instructionif imbriquée :

if (x > 50) {  // faire quelque chose} else if (x > 5) {  // faire autre chose} else {  // faire encore autre chose}

Affectation de variable dans l'expression conditionnelle

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'instructionwhile contient une section surl'affectation dans une condition et un exemple de la syntaxe à privilégier dans ces cas.