Apprendre les Conditions en JavaScript

Les conditions
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre JavaScript ES6 - Les fondamentaux
Revoir le teaser Je m'abonne
3,5
Transcription

69,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Description Programme Avis
3,5
69,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Les objectifs de cette vidéo sont d'apprendre à utiliser les instructions if, else et else if, à comprendre l'importance des opérateurs == et ===, à maîtriser l'utilisation des switch case, et à connaître l'opérateur ternaire.

Cette leçon explique comment utiliser des conditions pour contrôler l'exécution de votre code en JavaScript.

Dans cette leçon, nous explorons comment utiliser les conditions en JavaScript pour exécuter différentes parties de code en fonction de certaines valeurs. Nous commençons par l'instruction if, permettant d'exécuter un bloc de code uniquement si une condition donnée est vraie. Nous abordons ensuite la différence entre les opérateurs == et ===, démontrant l'importance de vérifier non seulement la valeur mais aussi le type des variables.

Ensuite, nous introduisons le bloc else pour gérer les cas où la condition initiale n'est pas remplie, et else if pour évaluer plusieurs conditions successives. Nous passons ensuite au switch case, une structure qui permet de comparer une variable à de multiples valeurs possibles plus efficacement que des blocs if-else imbriqués.

Enfin, nous découvrons l'opérateur ternaire pour écrire des conditions plus compactes. Tout au long de la leçon, nous mettons en pratique ces concepts avec des exemples concrets et des conseils pour éviter les erreurs communes.

Voir plus
Questions réponses
Qu'est-ce qu'une condition en JavaScript?
Une condition en JavaScript permet d'exécuter une partie spécifique du code seulement si une certaine condition est vérifiée.
Quelle est la différence entre '==' et '===' en JavaScript?
En JavaScript, '==' compare uniquement les valeurs tandis que '===' compare à la fois les valeurs et les types.
Quand utiliser le bloc 'switch case'?
Le bloc 'switch case' est utilisé quand vous devez comparer une variable à plusieurs valeurs possibles de manière plus lisible et efficace qu'avec plusieurs blocs 'if-else'.
On va voir maintenant les conditions qui vont nous permettre d'exécuter ou non une partie de notre code en fonction d'une condition justement. Donc là par exemple, si j'ai envie d'exécuter la ligne 6, mon console.log, uniquement si une condition est vraie, on va dire si par exemple, si nombre égale 42, on a envie de faire mon console.log. Donc je vais nettoyer la console juste ici pour qu'on voit bien. On va enlever ça, et avec le mot clé if, on va pouvoir définir notre condition. Donc ça s'écrit comme ça. Donc on va dire si, ensuite on va ouvrir des parenthèses, on va mettre des accolades pour définir ce qu'on appelle un scope, et ensuite on va pouvoir définir juste ici notre condition. If condition, donc nous ce qu'on veut c'est vérifier que nombre est bien égale à 42. Donc on va écrire nombre, et ensuite pour vérifier une égalité en JavaScript, on va utiliser égale égale 42. Et ensuite ici, on va pouvoir utiliser console.log et faire notre message. Donc on voit dans la console ici que ça s'affiche correctement. Si par exemple, mon nombre est égal à... Alors je vais supprimer ce qu'il y a dans la console, et si par exemple mon nombre est égal à 43, on voit qu'il ne se passe rien du tout dans la console. On peut vérifier en mettant un else, qui veut vouloir dire si mon nombre est égal à 42, fait ça, et le else, sinon, fait autre chose. Donc on va afficher autre chose. On va lui afficher un else par exemple, et voilà. Donc on voit qu'ici, il y a écrit else, donc la condition nombre égale 42 est fausse. Donc ici, on a besoin que ça soit vrai, soit faux. Et ici c'est faux, donc on va rentrer dans le else. On ne va pas utiliser simplement égal, parce que le égal va nous permettre d'assigner une valeur. Donc ici, on ne va pas vouloir assigner une valeur, on va vouloir vérifier une égalité. Donc on va utiliser un deuxième égal. Il y a une petite particularité en JavaScript, c'est qu'on va pouvoir vérifier à la fois la valeur contenue dans une variable, mais on va pouvoir aussi vérifier son type. Je vous explique. Ici, à la place de nombre, je pourrais écrire 42. Du coup, 42 est bien égal à 42, il n'y a aucun problème. Par contre, si 42 devient une chaîne de caractères, et que sur la partie droite, ça reste un nombre, je vais comparer une chaîne de caractères avec un nombre. Si on réexécute ce code, on voit que ça m'écrit ici, dans la console.log, le message, qui est hello world, et mon nombre, qui est ici, qui est 43. Donc ça veut dire que là, je suis capable, avec le égal égal, de comparer une chaîne de caractères avec un nombre, peu importe le type de la variable, l'égalité va vérifier uniquement la valeur. En JavaScript, il existe trois égales, qui va vérifier et la valeur, et le type. Là, ça m'a écrit else dans la console, ça veut dire que cette condition est fausse, et ici, je suis rentré dans mon else. Donc moi, je vous conseille toujours d'utiliser les trois égales, pour être sûr que vous avez bien et la même valeur, et le même type, afin d'éviter tous les problèmes. Pour définir des conditions dans votre code, vous pouvez utiliser if, else, même else if, si vous avez envie de définir plusieurs conditions. Mais vous pouvez aussi utiliser ce qu'on appelle le switch case. Je vais vous montrer comment ça s'utilise. Alors la syntaxe est très simple, on va ici indiquer switch, et on va indiquer sur quoi on a envie de switcher. Donc si on a envie de switcher sur le nombre. Ensuite, on va définir ici des case. Donc par exemple, j'ai envie de switcher sur nombre, et tester si nombre vaut 42 par exemple. Ensuite, je vais mettre deux points, et je vais faire quelque chose. Par exemple, console.log 42. Et ensuite, on va mettre un break, pour éviter que les autres cas soient utilisés. On va essayer ici avec 43. On va écrire la même chose, avec cette fois-ci 43. Et on peut même mettre un cas par défaut. Là on va dire que ça ne concerne aucun des cas plus haut. Donc je nettoie ma console, et du coup je vous explique un petit peu plus en détail. Je switch sur la valeur contenue dans nombre, et ensuite cas par cas, le code va tester la valeur. Et s'il tombe sur cette valeur là, il va exécuter le code à l'intérieur. Sur cette valeur là, le code ici à l'intérieur. Et si jamais il ne tombe sur aucune valeur dans un des case, il va exécuter ce qu'il y a dans défaut. Donc là, si vous avez bien compris, comme nombre est égal à 43, on va tomber ici sur cette condition. En javascript, on n'est pas obligé de mettre les points virgules. Vous pouvez les enlever. En version compilée, peut-être que le compilateur va vous rajouter les points virgules. Vous n'êtes pas obligé d'utiliser les points virgules. Donc simplifiez-vous l'avis, ne les mettez pas. On va utiliser break ici. Je vous le répète, c'est pour que si jamais on tombe sur la condition 42, on n'exécute pas le test de 43, parce qu'on est déjà dans la bonne condition. Donc ici, mon nombre est égal à 43. Je suis sur ce cas là, et je vais logger la chaîne de caractère 43. On voit bien dans ma console que j'ai un 43 qui apparaît. Si ici, je mets 42, j'ai un 42 qui apparaît, parce que je rentre dans ce cas là et je n'exécute pas le reste des conditions. Et du coup, si je mets 41, ça ne m'affiche aucun, parce que je n'ai pas de condition correcte qui est vérifiée, mais j'ai quand même un cas par défaut qui ne m'a affiché aucun. Donc avec le switch, on peut, un petit peu comme avec le else, dire que si la condition ou aucune condition n'est validée, on va exécuter ce cas là par défaut. La dernière façon de réaliser des conditions en javascript et dans d'autres langages, ça va être d'utiliser ce qu'on appelle les ternaires. Ça va nous permettre d'avoir une syntaxe beaucoup plus compacte et sur une seule ligne de définir une condition. Donc pour que vous voyez bien, ma variable nombre, je vais la renommer nb. Et ensuite, on va essayer de faire un console.log selon une condition. Donc pour faire un ternaire, on va lui dire que si nb est égal à 42, alors je veux que dans la console, il y ait 42, sinon je veux qu'il y ait la lettre F par exemple. Donc si je clean ma console, je vois qu'ici, j'ai le F qui apparaît dans la console. Alors comment ça marche ? Mon nombre nb vaut 41. Donc ici dans un ternaire, j'ai trois parties. J'ai la première partie qui est la condition. Donc ici, on teste est-ce que nb vaut 42. Avec les trois égales, on teste vraiment le type et la valeur. Ensuite, on va mettre un point d'interrogation et on va dire que si c'est vrai, alors on va exécuter la première partie qui est entre la condition et la dernière partie qui va être le cas où c'est faux. Un petit peu comme un if-else. Donc là, ça va être if nb est égal à 42. Je fais ça dans mon scope du if. Et ça, c'est mon else. J'affiche un F. Ça va fonctionner parce que je suis dans un console.log, donc ça va s'afficher directement. On aurait très bien pu écrire si nb est égal à 42, le point d'interrogation console.log de 42, deux points console.log de F. Ça fonctionne un petit peu. Voilà, c'est modulable. On fait comme on veut. Ici, la syntaxe est un petit peu plus courte. Donc ici, j'ai bien un F dans la console. Si jamais je mets mon 42 ici, j'ai la condition qui est validée. Donc je rentre ici, et pas là par contre, et j'ai 42 qui s'affiche dans la console.

Programme détaillé de la formation

8 commentaires
3,5
8 votes
5
4
3
2
1
C0C23DAC-E0F0-4671-A5DA-98CC3C3F0FD7@cyberlibris.studi.fr
Il y a 2 weeks
Commentaire
RAS
elephorm-1344761@addviseo.com
Il y a 4 months
Commentaire
Le cours sont pas assez adaptés pour une personne qui débute un peu les langages informatiques
85F76F55-E9A7-4111-B6B2-79CB51A205B9@cyberlibris.studi.fr
Il y a 7 months
Commentaire
EXCELLENT
93DAC8BB-E168-4366-B5BE-6F3D0B39B74D@cyberlibris.studi.fr
Il y a 9 months
Commentaire
super
wastiaux.william
Il y a 2 years
Commentaire
Un peu léger, le cour survole toutes les notions de bases. L'idéal est de visionner les cours en x2.
Si vous êtes novices, vous pourrez rentrer rapidement dans le monde du js.
michaellaunay
Il y a 3 years
Commentaire
Bonne formation pour qui sait déjà programmer dans un autre langage. Une formation sur Javascript avancé serait fort appréciée ;-)
olivierousmail
Il y a 3 years
Commentaire
Formation inadaptée pour un débutant, donne des concepts sans les expliquer, qu'est ce qu'un tableau ? qu'est ce qu'une fonction ? focalise tout le premier module sur l'utilisation de constantes alors qu'on est loin de les utiliser régulièrement.

Formation faite pour revenir dessus après avoir suivi une "réelle" formation sur les bases de Javascript.
lepajollecfranck
Il y a 3 years
Commentaire
Très bons contenus et bonnes explications. Manque d'un second module pour aller plus loin dans l'exemple.

Nos dernières formations JavaScript
  • Apprendre Vue JS 3
    Découvrir
    Apprenez à créer des applications web modernes avec notre formation "Apprendre Vue JS 3". Rejoignez-nous et maîtrisez ce puissant framework JavaScript ! 🚀 #VueJS #FormationWeb #Développement
    11h47 91 leçons
  • Savoir programmer en Node.js
    Découvrir
    Apprendre à programmer en Node.js
    2h14 15 leçons
  • Apprendre Javascript - Les fondamentaux
    Découvrir
    Apprendre le langage de programmation JavaScript
    2h55 29 leçons 4,50 / 5