Parfois, nous devons effectuer différentes actions en fonction de différentes conditions.
Pour ce faire, nous pouvons utiliser l'instruction if et l'opérateur conditionnel ? , c'est aussi ce qu'on appelle un opérateur « point d'interrogation ».
L'instruction if(...) évalue une condition entre parenthèses et, si le résultat est true , exécute un bloc de code.
Par exemple:
let year = prompt('En quelle année la spécification ECMAScript-2015 a-t-elle été publiée ?', '');
if (année == 2015) alert( 'Vous avez raison !' ); Dans l'exemple ci-dessus, la condition est une simple vérification d'égalité ( year == 2015 ), mais elle peut être beaucoup plus complexe.
Si nous voulons exécuter plus d’une instruction, nous devons placer notre bloc de code entre accolades :
si (année == 2015) {
alert( "C'est exact !" );
alert( "Tu es si intelligent !" );
} Nous vous recommandons d'entourer votre bloc de code d'accolades {} chaque fois que vous utilisez une instruction if , même s'il n'y a qu'une seule instruction à exécuter. Cela améliore la lisibilité.
L'instruction if (…) évalue l'expression entre parenthèses et convertit le résultat en booléen.
Rappelons les règles de conversion du chapitre Conversions de types :
Un nombre 0 , une chaîne vide "" , null , undefined et NaN deviennent tous false . C’est pour cette raison qu’on les appelle des valeurs « fausses ».
D'autres valeurs deviennent true , c'est pourquoi elles sont dites « vraies ».
Ainsi, le code sous cette condition ne s’exécuterait jamais :
if (0) { // 0 est faux
...
}…et dans cette condition – ce sera toujours le cas :
if (1) { // 1 est vrai
...
} Nous pouvons également transmettre une valeur booléenne pré-évaluée à if , comme ceci :
soit cond = (année == 2015) ; // l'égalité est évaluée à vrai ou faux
si (suite) {
...
} L'instruction if peut contenir un bloc else facultatif. Il s'exécute lorsque la condition est fausse.
Par exemple:
let year = prompt('En quelle année la spécification ECMAScript-2015 a-t-elle été publiée ?', '');
si (année == 2015) {
alert( 'Vous avez bien deviné !' );
} autre {
alert( 'Comment peux-tu te tromper à ce point ?' ); // n'importe quelle valeur sauf 2015
} Parfois, nous souhaitons tester plusieurs variantes d’une condition. La clause else if nous permet de faire cela.
Par exemple:
let year = prompt('En quelle année la spécification ECMAScript-2015 a-t-elle été publiée ?', '');
si (année < 2015) {
alert( 'Trop tôt...' );
} sinon si (année > 2015) {
alert( 'Trop tard' );
} autre {
alert( 'Exactement !' );
} Dans le code ci-dessus, JavaScript vérifie d'abord year < 2015 . Si cela est faux, cela passe à la condition suivante year > 2015 . Si cela est également faux, la dernière alert s'affiche.
Il peut y en avoir plus else if des blocages. Le dernier else est facultatif.
Parfois, nous devons attribuer une variable en fonction d'une condition.
Par exemple:
laisser accessAllowed ;
let age = prompt('Quel âge as-tu ?', '');
si (âge > 18) {
accèsAutorisé = vrai ;
} autre {
accèsAutorisé = faux ;
}
alert(accessAllowed);L’opérateur dit « conditionnel » ou « point d’interrogation » nous permet de le faire de manière plus courte et plus simple.
L'opérateur est représenté par un point d'interrogation ? . Parfois, on l'appelle « ternaire », car l'opérateur a trois opérandes. C’est en fait le seul et unique opérateur en JavaScript qui en possède autant.
La syntaxe est :
soit résultat = condition ? valeur1 : valeur2;
La condition est évaluée : si elle est vraie, alors value1 est renvoyée, sinon – value2 .
Par exemple:
let accessAllowed = (âge > 18) ? vrai : faux ;
Techniquement, on peut omettre les parenthèses autour age > 18 . L'opérateur point d'interrogation a une faible priorité, il s'exécute donc après la comparaison > .
Cet exemple fera la même chose que le précédent :
// l'opérateur de comparaison "age > 18" s'exécute en premier de toute façon // (pas besoin de le mettre entre parenthèses) laissez accessAllowed = âge > 18 ? vrai : faux ;
Mais les parenthèses rendent le code plus lisible, nous vous recommandons donc de les utiliser.
Veuillez noter:
Dans l'exemple ci-dessus, vous pouvez éviter d'utiliser l'opérateur point d'interrogation car la comparaison elle-même renvoie true/false :
// le même laissez accessAllowed = âge > 18 ;
Une séquence d'opérateurs de point d'interrogation ? peut renvoyer une valeur qui dépend de plusieurs conditions.
Par exemple:
let age = prompt('age?', 18);
laissez message = (âge < 3) ? 'Salut bébé!' :
(âge < 18) ? 'Bonjour!' :
(âge < 100) ? 'Salutations!' :
« Quel âge inhabituel ! » ;
alerte(message);Au début, il peut être difficile de comprendre ce qui se passe. Mais en y regardant de plus près, on s'aperçoit qu'il ne s'agit que d'une simple séquence de tests :
Le premier point d'interrogation vérifie si age < 3 .
Si c'est vrai, il renvoie 'Hi, baby!' . Sinon, il continue avec l'expression après les deux points « : », vérifiant age < 18 .
Si c'est vrai, il renvoie 'Hello!' . Sinon, il continue avec l'expression après les deux points suivants « : », en vérifiant age < 100 .
Si c'est vrai, il renvoie 'Greetings!' . Sinon, il continue avec l'expression après le dernier deux-points « : », renvoyant 'What an unusual age!' .
Voici à quoi cela ressemble en utilisant if..else :
si (âge < 3) {
message = 'Salut, bébé !';
} sinon si (âge < 18 ans) {
message = 'Bonjour !';
} sinon si (âge < 100) {
message = 'Salutations !';
} autre {
message = 'Quel âge inhabituel !';
} Parfois le point d'interrogation ? est utilisé en remplacement de if :
let company = prompt('Quelle entreprise a créé JavaScript ?', '');
(société == 'Netscape') ?
alert('Bien !') : alert('Faux.'); Selon la condition company == 'Netscape' , la première ou la deuxième expression après le ? est exécuté et affiche une alerte.
Nous n'attribuons pas de résultat à une variable ici. Au lieu de cela, nous exécutons du code différent en fonction de la condition.
Il n'est pas recommandé d'utiliser l'opérateur point d'interrogation de cette manière.
La notation est plus courte que l'instruction if équivalente, ce qui plaît à certains programmeurs. Mais c'est moins lisible.
Voici le même code en utilisant if à titre de comparaison :
let company = prompt('Quelle entreprise a créé JavaScript ?', '');
if (entreprise == 'Netscape') {
alert('Bien !');
} autre {
alert('Faux.');
}Nos yeux scannent le code verticalement. Les blocs de code qui s'étendent sur plusieurs lignes sont plus faciles à comprendre qu'un long jeu d'instructions horizontal.
Le but de l'opérateur point d'interrogation ? est de renvoyer une valeur ou une autre en fonction de son état. Veuillez l'utiliser exactement pour cela. Utilisez if lorsque vous devez exécuter différentes branches de code.
importance : 5
L' alert sera-t-elle affichée ?
si ("0") {
alert( 'Bonjour' );
}
Oui, ce sera le cas.
Toute chaîne sauf une chaîne vide (et "0" n'est pas vide) devient true dans le contexte logique.
Nous pouvons exécuter et vérifier :
si ("0") {
alert( 'Bonjour' );
}importance : 2
À l'aide de la construction if..else , écrivez le code qui demande : « Quel est le nom « officiel » de JavaScript ?
Si le visiteur saisit « ECMAScript », alors affiche « Right ! », sinon – affiche : « Vous ne savez pas ? ECMAScript ! »
Démo dans une nouvelle fenêtre
<!DOCTYPEhtml>
<html>
<corps>
<script>
« utiliser strict » ;
let value = prompt('Quel est le nom "officiel" de JavaScript ?', '');
si (valeur == 'ECMAScript') {
alert('Bien !');
} autre {
alert("Vous ne savez pas ? ECMAScript !");
}
</script>
</corps>
</html>importance : 2
En utilisant if..else , écrivez le code qui obtient un numéro via prompt , puis s'affiche en alert :
1 , si la valeur est supérieure à zéro,
-1 , si inférieur à zéro,
0 , si est égal à zéro.
Dans cette tâche, nous supposons que l’entrée est toujours un nombre.
Démo dans une nouvelle fenêtre
let value = prompt('Tapez un nombre', 0);
si (valeur > 0) {
alerte( 1 );
} sinon si (valeur < 0) {
alerte( -1 );
} autre {
alerte( 0 );
}importance : 5
Réécrivez ceci if vous utilisez l'opérateur conditionnel '?' :
laissez le résultat ;
si (a + b < 4) {
résultat = 'Ci-dessous';
} autre {
résultat = 'Terminé' ;
}
soit le résultat = (a + b < 4) ? 'Ci-dessous' : 'Terminé';
importance : 5
Réécrivez if..else en utilisant plusieurs opérateurs ternaires '?' .
Pour plus de lisibilité, il est recommandé de diviser le code en plusieurs lignes.
laisser un message ;
if (login == 'Employé') {
message = 'Bonjour';
} else if (login == 'Directeur') {
message = 'Salutations';
} sinon si (connexion == '') {
message = 'Pas de connexion';
} autre {
message = '';
}
let message = (login == 'Employé') ? 'Bonjour' : (connexion == 'Directeur') ? 'Salutations' : (connexion == '') ? 'Pas de connexion' : '';