La condition « if else »
Enfin nous abordons les conditions ! Ou, plus exactement, les structures conditionnelles, mais nous écrirons dorénavant le mot « condition » qui sera quand même plus rapide à écrire et à lire.
Avant toute chose, précisons qu'il existe trois types de conditions, nous allons commencer par la condition if else qui est la plus utilisée.
Mais à quoi sert une condition ? On n'a pas déjà vu les opérateurs conditionnels juste avant qui permettent déjà d'obtenir un résultat ?
Effectivement, nous arrivons à obtenir un résultat sous forme de booléen, mais c'est tout. Maintenant, il serait bien que ce résultat puisse influer sur l'exécution de votre code. Nous allons tout de suite entrer dans le vif du sujet avec un exemple très simple :
Code : JavaScript
1 2 3 4 5 6 7 |
if (true) { alert("Ce message s'est bien affiché."); }
if (false) { alert("Pas la peine d'insister, ce message ne s'affichera pas."); } |
Tout d'abord, voyons de quoi est constitué une condition :
Comme vous pouvez le constater, le code d'une condition est exécuté si le booléen reçu est true alors que false empêche l'exécution du code.
Et vu que nos opérateurs conditionnels renvoient des booléens, nous allons donc pouvoir les utiliser directement dans nos conditions :
Code : JavaScript
1 2 3 4 5 6 7 |
if (2 < 8 && 8 >= 4) { // Cette condition renvoie « true », le code est donc exécuté alert('La condition est bien vérifiée.'); } if (2 > 8 || 8 <= 4) { // Cette condition renvoie « false », le code n'est donc pas exécuté alert("La condition n'est pas vérifiée mais vous ne le saurez pas vu que ce code ne s'exécute pas."); } |
Comme vous pouvez le constater, avant nous décomposions toutes les étapes d'une condition dans plusieurs variables, dorénavant nous vous conseillons de tout mettre sur une seule et même ligne car ce sera plus rapide à écrire pour vous et plus facile à lire pour tout le monde.
Afin d'aller un petit peu plus loin dans le cours, nous allons apprendre l'utilisation d'une fonction bien pratique : confirm() ! Son utilisation est simple : on lui passe en paramètre une chaîne de caractères qui sera affichée à l'écran et elle retourne un booléen en fonction de l'action de l'utilisateur ; vous allez comprendre en essayant :
Code : JavaScript
1 2 3 |
if (confirm('Voulez-vous exécuter le code Javascript de cette page ?')) { alert('Le code a bien été exécuté !'); } |
Comme vous pouvez le constater, le code s'exécute lorsque vous cliquez sur le bouton OK et ne s'exécute pas lorsque vous cliquez sur Annuler. En clair : dans le premier cas la fonction renvoie true et dans le deuxième cas elle renvoie false. Ce qui en fait une fonction très pratique à utiliser avec les conditions.
Après ce petit intermède nous pouvons revenir à nos conditions.
Admettons maintenant que vous souhaitiez exécuter un code suite à la vérification d'une condition et exécuter un autre code si elle n'est pas vérifiée. Il est possible de le faire avec deux conditions if mais il existe une solution beaucoup plus simple, la structure else :
Code : JavaScript
1 2 3 4 5 6 7 |
if (confirm('Pour accéder à ce site vous devez avoir 18 ans ou plus, cliquez sur "OK" si c\'est le cas.')) { alert('Vous allez être redirigé vers le site.'); }
else { alert("Désolé, vous n'avez pas accès à ce site."); } |
Comme vous pouvez le constater, la structure else permet d'exécuter un certain code si la condition n'a pas été vérifiée, et vous allez rapidement vous rendre compte qu'elle vous sera très utile à de nombreuses occasions.
Concernant la façon d'indenter vos structures if else, il est conseillé de procéder de la façon suivante :
Code : JavaScript
1 2 3 4 5 |
if ( /* condition */ ) { // Du code… } else { // Du code… } |
Ainsi la structure else suit directement l'accolade de fermeture de la structure if, pas de risque de se tromper quant au fait de savoir quelle structure else appartient à quelle structure if . Et puis c'est, selon les goûts, un peu plus « propre » à lire. Enfin vous n'êtes pas obligés de faire de cette façon, il s'agit juste d'un conseil.
Bien, vous savez exécuter du code si une condition se vérifie et si elle ne se vérifie pas, mais il serait bien de savoir fonctionner de la façon suivante :
Cette espèce de cheminement est bien pratique pour tester plusieurs conditions à la fois et exécuter leur code correspondant. La structure else if permet cela, exemple :
Code : JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
var floor = parseInt(prompt("Entrez l'étage où l'ascenseur doit se rendre (de -2 à 30) :"));
if (floor == 0) {
alert('Vous vous trouvez déjà au rez-de-chaussée.');
} else if (-2 <= floor && floor <= 30) {
alert("Direction l'étage n°" + floor + ' !');
} else {
alert("L'étage spécifié n'existe pas.");
} |
À noter que la structure else if peut être utilisée plusieurs fois de suite, la seule chose qui lui est nécessaire pour pouvoir fonctionner est d'avoir une condition avec la structure if juste avant elle.
Créé avec HelpNDoc Personal Edition: Création d'aide CHM, PDF, DOC et HTML d'une même source