3.8 Les Opérateurs Logiques avec les non-booléens

Dans la dernière leçon, vous avez appris à manipuler des opérateurs logiques, dans tous les exemples que vous avez vu dans la dernière leçon, nous avons utilisé ces opérateurs logiques avec des valeurs booléennes. Mais en JavaScript, contrairement à deux nombreux langages de programmation, nous pouvons utiliser ces opérateurs logiques avec des valeurs non-booléennes et c'est extrêmement puissant. Permettez-moi de vous montrer quelques exemples, disons que nous avons faux ou vrai selon vous quel est le résultat de cette expression ? Eh bien c'est vrai. Maintenant que se passe-t-il si nous avons faux ou la chaîne 'Toto', selon vous quel est le résultat de cette expresssion ? Et bien jetons un coup d'œil, on récupère 'Toto'. Et si nous avons faux ou un numéro 1. On récupere le numéro 1. Voici donc la première chose que vous devez réaliser. Le résultat d'une expression logique n'est pas nécessairement vrai ou faux, cela dépend de la valeur de l'opérance que nous avons. Dans le premier exemple notre deuxième opérande est vrai et c'est pourquoi nous avons vrai. Dans le deuxième exemple notre deuxième opérante est une chaine, c'est pourquoi nous récupérons une chaîne et du même coup dans le 3e exemple nous récuperons un number. Lorsque notre moteur JavaScript essaie d'évaluer cette expression, il regarde chaque opérande si cet opérande n'est pas un booléen vrai ou faux. Il essaiera de l'interpréter comme valeur de type vrai qu'on appelle Truthy ou valeur de type fausse qu'on appelle Falsy. En JavaScript, nous avons des valeurs que nous appelons Falsy, ce n'est pas un faux booléen, c'est une valeur de type fausse. Quelles sont les valeurs de type Falsy? Eh bien nous avons un Undefined. Un null Un numéro 0. La chaîne booléenne False, un vide et enfin à NaN c'est-à-dire n'est pas un nombre. Donc le verrons cela plus tard dans le cours, pour l'instant juste rappelez-vous n'est pas un nombre est une valeur spéciale dans Javascript et que nous avons à faire un calcul mathématique qui ne produit pas de valeur valide, cette valeur renvoie NaN n'est pas un nombre. Nous allons maintenant examiner cela plus tard dans le cours, voici donc les valeurs de Falsy. En JavaScript , nous utilisons l'une de ses valeurs dans une expression logique, elles seront traitées comme Falsy, c'est ce qui est un peu comme booléen faux mais ce n'est pas exactement la même chose. Maintenant tout ce qui n'est pas Falsy et Truthy c'est-à-dire de type vrai. Revenons donc à ces exemples, dans le deuxième exemple, notre deuxième est une chaine de 4 caractères, donc ce n'est pas une chaine vide ce n'est pas Falsy donc c'est vrai. Lorsque notre moteur JavaScript essaie d'évaluer cela, il regarde le premier opérande, il est faux, donc la recherche continue car avec un opérateur logique OR. Comme vous l'avez appris dans la dernière leçon, tant qu'un des opérande est vrai le résultat sera vrai, maintenant ici dans le deuxième exemple, le premier opérande est faux donc la recherche continue en espérant que l'autre opérande soit vrai ou Truthy, dans ce cas nous avons affaire à une valeur Trurthy. Cette valeur est donc immédiatement renvoyer. Il en va de même pour le troisième exemple, donc ici ce n'est pas un booléen vrai, c'est un Truthy, c'est pourquoi la valeur de cette opérande est retourné. Maintenant que se passe-t-il si nous avons une expression comme celle-ci False ou 1 ou 2. Que pensez-vous que nous allons obtenir ? Jetons un coup d'œil, on obtient 1, c'est donc autre chose que vous devez comprendre à propos de l'opérateur logique OR. L'évaluation commence ici dès que nous trouvons un opérande qui est Truthy, cet opérande est retourné, donc ici notre deuxième opérande est Truthy, sa valeur est retourné et ici l'évaluation s'arrete. Peu importe ce que nous avons du côté droit, nous pourrions avoir un million d'autres opérandes ils sont complètement ignorés, c'est ce que nous appelons le court-circuit. C'est exactement comme les court-circuits électriques. Maintenant que vous comprenez comment ces opérateurs logiques fonctionnent avec des valeurs non-booléennes, permettez-moi de vous donner un exemple concret sur le moment de l'utilisation. Imaginons donc une application, et quelque part où l'utilisateur doit choisir une couleur ou nous allons utiliser une couleur par défaut, c'est peut-être la couleur du t-shirt qu'il veut acheter. On va donc déclarer quelques variables qu'on va appeler userCouleur, on définit cela sur rouge. On définit ensuite une nouvelle variable qu'on appelle défaultColor. On définit cela sur bleu. Et enfin currentColor qu'on définit sur userColor ou defaultColor. Lisons maintenant cette expression userColor ou defaultColor qui signifie essentiellement que si nous avons une valeur pour userColor, nous allons utiliser, sinon nous utiliserons defaultColor. Maintenant on enregistre cela sur la console on fait un console.log de currentColor on obtient rouge parce que notre utilisateur à sélectionné une couleur. En revanche, si l'utilisateur n'a pas sélectionné de couleur, on définit sur undefined, on enregistre les modifications et on obtient bleu. Parce que le défaultColor est bleu. C'est donc le pouvoir d'utiliser l'opérateur logiques OR entre non-booléen. Avec cette technique, nous pouvons fournir des valeurs par défaut, donc si l'utilisateur a sélectionné une couleur, nous allons l'utiliser, sinon nous allons utiliser notre couleur par défaut et qui détermine la couleur actuelle que nous allons afficher à l'écran. Voilà pour cette démonstration sur les opérateurs logiques avec les non-booléens. On se retrouve pour la prochaine démonstration où on va parler des opérateurs bitWise.