4.1 If..else

Dans la dernière section, vous avez découvert les expressions et les opérateurs, dans cette section nous allons utiliser ces expressions et opérateurs ainsi que des instructions conditionnelles pour implémenter l'interactivité dans nos applications. En JavaScript, nous avons deux types d'instructions conditionnelles, nous avons if et else, switch et case. Dans cette vidéo, vous allez découvrir if et else et nous verrons switch case dans le prochain cours. Imaginez donc dans notre application que nous allons obtenir l'heure actuelle en fonction de sa valeur. Nous allons saluer l'utilisateur avec un message différent. Si l'heure est entre 6h et 12h, alors on affiche quelque chose comme Bonjour. De même si c'est entre 12h et 18h, alors on affiche bon après-midi. Sinon on affiche Bonsoir. Nous voulons avoir une logique comme celle-ci dans notre application. C'est là que nous utilisons if et else, nous commençons donc par le if. Nous ajoutons des parenthèses et entre ces parenthèse nous ajoutons une condition. Si cette condition prend la valeur vrai, l'instruction que nous mettons après sera exécuté. Maintenant si vous avez plusieurs instructions, nous devons les mettre entre ces accolades, donc ceci est un bloc de code. En option, nous pouvons avoir une autre condition, donc on fait un else if, entre parenthèses (autreCondition) si cette condition est vrai, alors cette autre instruction sera exécuté et de même si nous avons plusieurs instructions, nous devons les entourer d'accolades comme ceci. Maintenant nous pourrions avoir encore une autre condition comme celle-ci nouvelle condition. Nous pourrions avoir autant de conditions que nous voulons, il n'y a pas de limitations et encore une fois ici nous avons une ou plusieurs instructions, si maintenant aucune de ces conditions on est évalué comme vrai, nous pourrions utiliser d'autres pour exécuter une ou plusieurs autres instructions. Voici donc la structure de base, nous voulons obtenir cette logique et la mapper dans cette structure, c'est très facile. Commençons donc par notre première condition, si l'heure est entre 6h et 12h, c'est donc la condition, et l'instruction que nous voulons executer est Bonjour. Je vais donc déclarer variable, ici qu'on va appeler heure et la mettre à 10, donc nous voulons comparer l'heure avec ces deux nombres, pour plus de simplicité, allons-y avec un format horaires de 24h afin que nous voulons voir si l'heure est supérieur ou égal à 6 et l'heure est inférieur à 12. Vous avez appris cela dans la dernière section, donc ici nous utilisons ces opérateurs de couparaison. Nous avons deux expressions, voici la première et voici la deuxième et nous appliquons la logique entre elles. Si ces deux expressions sont vraies, le résultat de cette expression sera également vraie. On fait un console.log de Bonjour et bien sûr nous devons terminer cette déclaration par un ";". Maintenant si vous voulez maîtriser JavaScript, mettez la vidéo en pause et continué à implémenter cette logique en utilisant if et else. Puis revenez et continuez à regarder la correction. Alors voici une deuxième condition, vous voulez vérifier si l'heure est comprise entre 12h et 18h, donc c'est très simple. Si l'heure est supérieur ou égal à 12 et inférieur à 18 nous voulons afficher bon aprèmidi. Alors on fait un console log de bon aprèm. Dans cet exemplen nous n'avons pas besoin de else if car comme nous l'indique l'énoncé sinon on affiche Bonsoir, on supprime donc ceci et à else on fait un console log de bonsoir. Dans cet exemple, parce que nous avons affaire à une seule déclaration, ces accolades genent et créer de la place dans le code il est donc préférable de s'en débarrasser et de simplifier le code. On enregistre les modifications et on obtient bonjour. Si je change l'heure à 13h on obtient bon après-midi et si je change à 20h, on obtient bonsoir. Voilà pour cette démonstration sur les instructions conditionnelle if et else, on se retrouve pour la prochaine démo ou vous allez en apprendre davantage sur les switch et case.