Aller au contenu

Maitrisez les conditions if else elseif switch case break avec JavaScript

Découvrez les instructions pour effectuer des conditions et exécuter différentes parties de votre code JavaScript.

En fonction d’un ou plusieurs tests, des instructions JavaScript différentes sont exécutées.

Tout est dans le cours vidéo ci-dessous.

[ppmaccordion][ppmtoggle title= »Afficher le texte de la vidéo »]

Maitrisez les conditions if else elseif switch case break avec JavaScript

Bonjour à tous et bienvenu sur Développement Facile.

Ce cours JavaScript consacré au langage JavaScript est directement la suite du cours précédent, avec, vous avez découvert les opérateurs arithmétiques dans le cours précédent ; les opérateurs de comparaison, et maintenant il est temps que vous appreniez à utiliser ces opérateurs, vous allez découvrir les conditions, comment utiliser des conditions avec le langage JavaScript.

Les conditions if

Vous avez les conditions if, donc if, vous mettez votre condition, vous utilisez bien évidemment les opérateurs de comparaison, les opérateurs arithmétiques, et vous faites votre bloc d’instruction si la condition est vraie, sinon vous pouvez faire un exit, une deuxième condition, si la condition deux est vraie, vous faites votre bloc instruction et si elle est fausse vous passez à else, et vous faites votre bloc d’instruction. Tout en sachant que vous pouvez faire un if condition 1 directement à else, ou juste un if condition 1 les instructions et rien du tout. Ou if condition 1 les instructions après vous passez au else if conditions 2 les instructions. Vous n’êtes pas obligé de tout le temps mettre un else. C’est vous qui voyez, en fonction justement de l’algorithme que vous avez défini dans votre application HTML JavaScript.
Voici un petit exemple, vous affichez boîte de dialogue confirme avec le message pour l’internaute, voulez-vous afficher la suite, OK, annuler. L’utilisateur clique sur OK, la variable qui est un booléen passe à True, donc on affiche une boîte de dialogue alerte félicitations, l’utilisateur appuie sur annuler, B OK ce booléen est à false, donc on fait un else alerte et on affiche le message stop, fin de chantier. Ça c’est pour les conditions if donc ça va vous permettre en fonction d’une condition, vous pouvez mettre plusieurs conditions if condition 1 et condition 2 ou condition 3, votre bloc d’instruction, donc vous pouvez bien évidemment, compliquer vos conditions.

Les conditions switch

Vous avez la condition switch, qui est également … en fait switch, des fois vous préférerez utiliser if conditions 1, else if condition 2, else if conditions 3, else if conditions 4, etc. Mais pensez que vous avez également le switch case, switch votre variable 1 ça peut être un texte, ça peut être un type number, vous faites case valeur 1 instruction et le break pour sortir du switch, si vous ne faites pas le break ça va passer au case 2 case 3 etc. Donc, pensez au break, souvent on l’oublie, ça m’est arrivé quelques fois d’oublier le break, du coup la condition ne fonctionne pas comme on l’espère.
Donc case valeur 1, instruction, break. Si la variable est égale à valeur 2, case valeur 2 instruction break, et vous pouvez mettre default ou pas, si vous voulez juste des switch case vous êtes pas obligé de mettre des default. Default c’est appelé si aucun case ne correspond, par défaut ça fera ce bloc d’instruction, switch variable n’est pas égale à valeur 1 ni à valeur 2 ni à valeur 3, ni à aucun de vos cases, par défaut on fera le bloc d’instruction. Vous pouvez faire également, un switch case valeur 1 directement sous case valeur 2, et le même bloc d’instruction, ça veut dire que si la variable à la valeur 1 ou la valeur 2 elle fera le même bloc d’instruction, donc vous pouvez mettre des cases les uns à la suite des autres, vous pouvez faire case valeur 1 instruction et vous ne mettez pas de break, si case valeur 2 vous pouvez ajouter encore d’autres instructions à effectuer. Donc le switch case est vraiment très pratique comme condition, pensez-y, trop souvent je rencontre des développeurs débutants et ils utilisent tout le temps else if, le if, mais pensez également au switch qui peut vous aider.

Exemple d’application

Un exemple de code source JavaScript, vous avez une borne de dialogue qui demande à l’utilisateur, JavaScript est un langage A non typé, B faiblement type, C typé, donc c’est la lettre correspondant, l’utilisateur est invité à choisir A, B ou C, vous faites un switch case en fonction de la réponse, A faux réessayez, B bien jouer c’est exact, case C archi faux, réessayez, et par défaut si l’utilisateur saisi n’importe quelle lettre, ou une lettre différente de A ou B, ça va mettre archifaux réessayez, remarquez, vous avez case default, comme je vous l’ai expliqué donc si la réponse est égale à C ou par défaut ça va afficher archifaux, réessayez, A faux réessayez, si l’utilisateur saisi B ça va afficher une boite de dialogue bien joué, c’est exacte.

Votre plan d’actions !

Là vous avez vraiment de quoi faire, avec les conditions if, else if, case, switch, default, donc ces conditions sont très pratiques pour lancer les différentes instructions dans une page Web, dans votre code JavaScript, en fonction des actions de l’utilisateur, du navigateur de l’utilisateur, donc retrouvez un exemple de code source directement sous cette vidéo, si vous avez des questions, posez-les sous ce cours est moi je dis à très bientôt sur Développement Facile.

 

[/ppmtoggle][/ppmaccordion]

Téléchargez le code source JavaScript

Voici un exemple de code JavaScript avec une condition de type switch.

Téléchargement du code source Exemple de condition switch avec JavaScript

Cliquez ici pour télécharger le code source Exemple de condition switch avec JavaScript

Quelles conditions utilisez-vous le plus souvent ?

Dites moi dans les commentaires, la condition que vous utilisez le plus souvent et pourquoi. Pour ma part, c’est le if / else if car il est très pratique pour effectuer un traitement spécial du code.

EXCLUSIF : Les 7 Secrets Révélés de JavaScript pour Créer VOS Applications — dès la semaine prochaine !

EXCLUSIF : La formation « JavaScript Facile » OFFERTE pour Créer VOS Applications — dès la semaine prochaine !

EXCLUSIF : Créez VOS Applications JavaScript — en moins de 7 jours grâce à notre formation OFFERTE « JavaScript Facile »

Que diriez-vous de Développer des Applications JavaScript Performantes — dès la semaine prochaine ?

TÉLÉCHARGEZ : Les codes sources du livre « JavaScript Facile » pour Créer VOS Applications — dès la semaine prochaine !

Cliquez ici pour tout recevoir >>