Instruction JavaScript if ... else (avec exemples)

Dans ce didacticiel, vous découvrirez l'instruction if… else pour créer des programmes de prise de décision à l'aide d'exemples.

Dans la programmation informatique, il peut se produire des situations où vous devez exécuter un bloc de code parmi plusieurs alternatives. Par exemple, attribuer les notes A , B ou C en fonction des notes obtenues par un élève.

Dans de telles situations, vous pouvez utiliser l' if… elseinstruction JavaScript pour créer un programme capable de prendre des décisions.

En JavaScript, il existe trois formes de if… elsedéclaration.

  1. si déclaration
  2. if… instruction else
  3. if… else if… else instruction

Instruction JavaScript if

La syntaxe de l' ifinstruction est:

 if (condition) ( // the body of if )

L' ifinstruction évalue la condition entre parenthèses ().

  1. Si la condition est évaluée true, le code à l'intérieur du corps de ifest exécuté.
  2. Si la condition est évaluée false, le code à l'intérieur du corps de ifest ignoré.

Remarque: Le code à l'intérieur ( )est le corps de l' ifinstruction.

Fonctionnement de l'instruction if

Exemple 1: instruction if

 // check if the number is positive const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( // the body of the if statement console.log("The number is positive"); ) console.log("The if statement is easy");

Sortie 1

 Entrez un nombre: 2 Le nombre est positif L'instruction if est facile

Supposons que l'utilisateur ait saisi 2 . Dans ce cas, la condition est number> 0évaluée à true. Et, le corps de l' ifinstruction est exécuté.

Sortie 2

 Entrez un nombre: -1 L'instruction if est facile

Supposons que l'utilisateur a entré -1 . Dans ce cas, la condition est number> 0évaluée à false. Par conséquent, le corps de l' ifinstruction est ignoré.

Puisqu'il console.log("The if statement is easy");est en dehors du corps de l' ifinstruction, il est toujours exécuté.

La comparaison et les opérateurs logiques sont utilisés dans les conditions. Donc, pour en savoir plus sur la comparaison et les opérateurs logiques, vous pouvez visiter Comparaison JavaScript et Opérateurs logiques.

Instruction JavaScript if… else

Une ifinstruction peut avoir une elseclause facultative . La syntaxe de l' if… elseinstruction est:

 if (condition) ( // block of code if condition is true ) else ( // block of code if condition is false )

L' if… elseinstruction évalue la condition entre parenthèses.

Si la condition est évaluée à true,

  1. le code à l'intérieur du corps de ifest exécuté
  2. le code à l'intérieur du corps de elseest ignoré de l'exécution

Si la condition est évaluée à false,

  1. le code à l'intérieur du corps de elseest exécuté
  2. le code à l'intérieur du corps de ifest ignoré de l'exécution
Fonctionnement de l'instruction if… else

Exemple 2: instruction if… else

 // check is the number is positive or negative/zero const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( console.log("The number is positive"); ) // if number is not greater than 0 else ( console.log("The number is either a negative number or 0"); ) console.log("The if… else statement is easy");

Sortie 1

 Entrez un nombre: 2 Le nombre est positif L'instruction if… else est facile

Supposons que l'utilisateur ait saisi 2 . Dans ce cas, la condition est number> 0évaluée à true. Par conséquent, le corps de l' ifinstruction est exécuté et le corps de l' elseinstruction est ignoré.

Sortie 2

 Entrez un nombre: -1 Le nombre est soit un nombre négatif soit 0 L'instruction if… else est facile

Supposons que l'utilisateur a entré -1 . Dans ce cas, la condition est number> 0évaluée à false. Par conséquent, le corps de l' elseinstruction est exécuté et le corps de l' ifinstruction est ignoré.

JavaScript if… else if instruction

L' if… elseinstruction est utilisée pour exécuter un bloc de code parmi deux alternatives. Cependant, si vous devez faire un choix entre plus de deux alternatives, if… else if… elsepeut être utilisé.

La syntaxe de l' if… else if… elseinstruction est:

 if (condition1) ( // code block 1 ) else if (condition2)( // code block 2 ) else ( // code block 3 )
  • Si la condition 1 est évaluée à true, le bloc de code 1 est exécuté.
  • Si la condition1 est évaluée à false, la condition2 est évaluée.
    • Si la condition2 est true, le bloc de code 2 est exécuté.
    • Si la condition2 est false, le bloc de code 3 est exécuté.
Fonctionnement de l'instruction if… else if… else

Exemple 3: if… else if Statement

 // check if the number if positive, negative or zero const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( console.log("The number is positive"); ) // check if number is 0 else if (number == 0) ( console.log("The number is 0"); ) // if number is neither greater than 0, nor zero else ( console.log("The number is negative"); ) console.log("The if… else if… else statement is easy");

Production

 Entrez un nombre: 0 Le nombre est 0 L'instruction if… else if… else est facile

Supposons que l'utilisateur a entré 0 , puis la première condition de test est number> 0évaluée false. Ensuite, la deuxième condition de test est number == 0évaluée trueet son bloc correspondant est exécuté.

Instruction if… else imbriquée

Vous pouvez également utiliser une if… elseinstruction à l'intérieur d'une if… elseinstruction. Ceci est appelé instruction if… else imbriquée .

Exemple 4: Instruction if… else imbriquée

 // check if the number is positive, negative or zero const number = prompt("Enter a number: "); if (number>= 0) ( if (number == 0) ( console.log("You entered number 0"); ) else ( console.log("You entered a positive number"); ) ) else ( console.log("You entered a negative number"); )

Production

 Enter a number: 5 You entered a positive number

Suppose the user entered 5. In this case, the condition number>= 0 evaluates to true, and the control of the program goes inside the outer if statement.

Then, the test condition, number == 0, of the inner if statement is evaluated. Since it's false, the else clause of the inner if statement is executed.

Note: As you can see, nested if… else makes our logic complicated and we should try to avoid using nested if… else whenever possible.

Body of if… else With Only One Statement

If the body of if… else has only one statement, we can omit ( ) in our programs. For example, you can replace

 const number = 2; if (number> 0) ( console.log("The number is positive."); ) else ( console.log("The number is negative or zero."); )

with

 const number = 2; if (number> 0) console.log("The number is positive."); else console.log("The number is negative or zero.");

Output

 The number is positive.

More on Decision Making

Dans certaines situations, un opérateur ternaire peut remplacer une if… elseinstruction. Pour en savoir plus, visitez l'opérateur ternaire JavaScript.

Si vous devez faire un choix entre plusieurs alternatives en fonction d'une condition de test donnée, l' switchinstruction peut être utilisée. Pour en savoir plus, visitez le commutateur JavaScript.

Articles intéressants...