Instructions conditionnelles JavaScript

if else et else if

Les instructions conditionnelles sont un ensemble d'instructions exécutées lorsque la condition spécifiée est true.

Dans de nombreux cas, vous souhaitez exécuter différents blocs de code en fonction de l'entrée de l'utilisateur ou d'autres facteurs.

Les instructions conditionnelles font partie de la logique, des décisions ou de la spécification des flux d'un programme informatique.

En JavaScript, nous avons les instructions conditionnelles suivantes :

• Instruction if

• Instruction if...else

• Instruction else...if

• Instruction switch

Nous discuterons du statement switch dans le prochain chapitre.

Instruction If en JavaScript

Seulement lorsque la condition spécifiée par if est true, l'instruction exécutera le code. La syntaxe est :

if　(condition)　{
　　//Bloc de code à exécuter si la condition est vraie
}

if　(x　<　0)　{
　　　document.getElementById("result").innerHTML = "NEGATIVE";
}

Instructions if ... else de JavaScript

Les instructions if...else vous permettent d'exécuter un bloc de code lorsque la condition spécifiée est true, et un autre bloc de code lorsque la condition est false. La syntaxe est :

if　(condition)　{
　　　//Bloc de code à exécuter si la condition est vraie
} else {
　　　//Bloc de code à exécuter si la condition est fausse
}

var　x　=　-4;
if　(x　<　0)　{
　　　msg　=　"NEGATIVE";
} else {
　　　msg　=　"POSITIVE";　　　
}

Si l'utilisateur clique sur l'image, l'exemple suivant changera la valeur de l'attribut src de l'image :

<img　id="demo"　onclick="changeImage()"　src="avatar-female.jpg">
<script>
function　changeImage()　{
　　　var　image　=　document.getElementById("demo");
　　　if　(image.src.match("female"))　{
　　　image.src　=　"avatar-male.jpg";
　　　} else {
　　　image.src　=　"avatar-female.jpg";
　　　}
}
</script>

Instructions else...if de JavaScript

En utilisant if...else, nous pouvons exécuter des blocs de code en fonction de la condition d'acceptation ou de refus. Mais, parfois, nous pouvons avoir plusieurs conditions possibles et des sorties, et ce n'est pas seulement deux options. Une méthode pour effectuer cette opération consiste à utiliser des instructions else...if, qui peuvent évaluer deux résultats possibles ou plus. La syntaxe est :

if　(condition1)　{
　　//Si condition1Bloc de code à exécuter si true
}　else　if　(condition2)　{
　　//Si condition1Si false et condition2Bloc de code à exécuter si true
} else {
　　//Si condition1Si false et condition2Bloc de code à exécuter si false
}

//　Définir le niveau actuel de l'étudiant
var　grade　=　88;
//　Vérifiez si le score est A, B, C, D, ou F
if　(grade　>=　90)　{
　　　document.write("A");
}　else　if　(grade　>=　80)　{
　　　document.write("B");
}　else　if　(grade　>=　70)　{
　　　document.write("C");
}　else　if　(grade　>=　60)　{
　　　document.write("D");
} else {
　　　document.write("F");
}

Instructions if ... else imbriquées

Vous pouvez utiliser des instructions if ... else imbriquées pour renforcer la capacité de décision des programmes JavaScript.

var a =　10, b =　20, c =　30;
var answer;
if (a > b) {
　　　if (a > c) {
　　answer = "A est le plus grand des trois";
　　　} else {
　　answer = "C est le plus grand des trois";
　　　}
} else if (b > c) {
　　　answer = "B est le plus grand des trois";
} else {
　　　answer = "C est le plus grand des trois";　　　
}

Opérateur ternaire

L'opérateur ternaire fournit un moyen simple d'écrire des instructions if ... else.

L'opérateur ternaire est écrit en syntaxe avec un point d'interrogation (?) et un deux-points (:), comme suit :

(condition) ? expression sur true : expression sur false

Dans la syntaxe ci-dessus,conditionD'abord, puis?. La première expression sera écrite danstrue surExécution, la deuxième expression sera écrite dansfalse surExécution.

Pour comprendre comment fonctionne l'opérateur ternaire, considérez l'exemple suivant :

var status = (age >=　18) ? "adult" : "minor";

Si l'âge est18Si l'âge est de 18 ans ou plus, la valeur "adult" est attribuée à la variable status. Sinon, il attribue la valeur "minor" à status.