Condition if...else en Javascript - Cours introductif

Condition if...else en Javascript - Cours introductif

Dans cet article, vous apprendrez à utiliser les conditions if..else en javascript afin d'ajouter de la logique dans votre code.

En programmation informatique, il peut y avoir des situations où vous devez exécuter un bloc de code en fonction de certains critères. Par exemple, attribuer les notes A, B ou C en fonction des notes obtenues par un étudiant.

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

En JavaScript, il existe trois formes de l'instruction if...else.

  • condition if
  • condition if...else
  • condition if...else if...else

Condition if javascript

Vous pouvez utiliser la fonction if javascript de la façon suivante si vous souhaitez exécuté du code que lors qu'un critère est rempli.

if (condition) {
 // exécute le code
 }

Par exemple, dans le code ci-dessous nous allons afficher un message que lorsque la note d'un élève est supérieure à 16.

const note = 17

if (note > 16) {
	alert('Bon élève')
 }

alert('Fini')

// affiche Bon élève puis Fini

L'instruction if évalue la condition contenue dans la parenthèse ().

  • Si la condition est évaluée comme vraie, le code à l'intérieur du corps if est exécuté puis continu.
  • Si la condition est évaluée comme fausse, le code à l'intérieur du corps if est ignoré et la fonction continue d'exécuter la suite du code.

Exemple :

const note = 12

if (note > 16) {
	alert('Bon élève')
}

alert('Fini')

// Affiche seulement Fini

Condition if...else en javascript

Une instruction if peut comporter une clause else facultative. La syntaxe de l'instruction if...else est la suivante :

if (condition) {
// si vrai alors exécute ici
} else {
// sinon exécute ici
}

Si la condition est vraie (true) :

  • le code à l'intérieur du corps de if est exécuté
  • le code à l'intérieur du corps de else n'est pas exécuté.

Si la condition est fausse (false) :

  • le code à l'intérieur du corps de else est exécuté
  • le code à l'intérieur du corps de if est ignoré de l'exécution
const note = 12

if (note > 16) {
	alert('Bon élève')
 } else {
 	alert('Mauvais élève')
 }

alert('Fini')

// affiche Mauvais élève puis Fini

Condition if...else if en javascript

L'instruction if...else est utilisée pour exécuter du code parmi deux alternatives. Toutefois, si vous devez faire un choix entre plus de deux alternatives, l'instruction if...else if...else peut être utilisée.

La syntaxe de l'instruction if...else if...else est la suivante :

if (condition) {
// exécute si condition 1 = true
} else if (condition2) {
//exécute si condition 2 = true
else {
// exécute si aucune condition n'est remplie
}

Par exemple, si l'on veut donner une note A, B, C ou D à un élève en fonction de la note qu'il a obtenu, on peut procéder comme ceci :

const note = 12

if (note > 17) {
	alert('A')
} else if (note > 15 && note <= 17) {
    alert('B')
} else if (note > 12 && note <= 15) {
	alert('C')
} else {
    alert('D')
}

// Affichera D

Condition if...else imbriquée javascript

Vous pouvez également utiliser une instruction if...else à l'intérieur d'une instruction if...else. C'est ce qu'on appelle une instruction if...else imbriquée.

const note = 12 

if (note > 10) {
	if (note < 14) {
    	alert('C')
    } else {
    	alert('D')
    }
 } else {
 	alert('E')
}    

Attention toutefois, il n'est pas recommandé d'imbriquer trop de if...else car votre code devient vite illisible et cela peut être très confusant.

Découvrez désormais comment utiliser une fonction en javascript.