JavaScript - opérateur et expression logique

Je suis retombé aujourd'hui sur le jeu "logical (or not)". Le principe ?  Nous afficher une expression logique JavaScript et nous devons déterminer le résultat. Et ce n'est pas toujours ce que nous croyons :)

Du coup, un petit rappel des opérateurs et des expressions logiques JavaScript

La différence entre == et ===

Si vous êtes développeur PHP, vous connaissez déjà la différence: l'usage du === fait d'abord une comparaison du type puis ensuite de la valeur.

Ainsi, l'expression suivante retourna faux:

'1' === 1 // false

Alors qu'avec les classiques == ça aurait retourné vraie:

'1' == 1 // true

Posons-nous alors la question: pourquoi ça retourne vraie ? Tout simplement parce qu'une conversion sera faite. Et selon un ordre précis: JavaScript va convertit l'opérande qui possède le type le plus faibleen se basant sur l'opérande qui a le type le plus fort.

Ainsi, par rapport à la dernière instruction, JavaScript va convertir la valeur numérique en valeur textuelle.

Abstract equality comparison

C'est ce que nous appelons l'abstract equality comparison algortihm. Cela se repose sur les principes suivants:

• Si nous comparons un nombre à un texte, le texte est convertie en nombre.
• Si nous comparons un texte à un booléen, le texte est convertit à
• false si le texte est vide
• true si le texte n'est pas vide
• Si l'un des opérandes est un booléen, celui-ci est convertit à
• 1 si la valeur true
• 0+ si la valeur est false
• Si un objet est comparé à un texte or un nombre, JavaScript essaie de convertir l'objet en texte ou en nombre
• Si un objet est comparé à un autre objet, JavaScript compare la référence des deux objets, et non la "valeur"

Ainsi, nous aurons:

'' == false // true
0 == false // true
1 == true // true
5 == true // false

undefined == true // false
undefined == null // true

L'usage de !!

Le double point d'exclamation a pour vocation de convertir une expression en booléen. Ainsi, si nous nous basons sur le chapitre précédent, nous aurons:

!!0  // false
!!1  // true
!!'' // false
!!'1' // true
!!null // false
!!undefined // false

Le retour de valeur d'une expression

Il faut faire attention car des fois, la valeur que nous allons avoir dans notre expression conditionnel ne retournera pas un booléen mais un entier, un texte, un objet ...

Cela dépend du type de la dernière partie de l'expression évalué qui sera jugé "true" (car convertie selon les règles vu précédemment).

Ainsi, nous aurons ce genre de résultats:

false || 'a' // 'a'
1 || 'a' // 1
0|| 'a' // 'a'
'b' && 'a' // a

Petite chose à savoir néanmoins

Parfois, nous allons avoir des surprises avec les opérateurs '<' et '>' car en fonction des valeurs que nous voulons comparés, nous n'aurons pas toujours ce que nous pensions avoir. Des exemples:

null <= 1 // true
null < 1 // true
null < 0 // false
null < '1' // true

A ce méfier donc

Déterminons alors les retours de valeurs

Listons un certain nombre d'expressions et voyons le type de retour:

2 > (3 && 0) // false ===> 2 > 3
null < 1 // true
!false || 'foo' // true ===> !false ===> true
![].length // true ===> !0
[] && [].push('foo') // 1 ===> true && [].push('foo') ===> true && 1
'foo' && 'bar' || 'quz' // 'bar' ===> 'bar' || 'qz'

Si vous voulez en voir plus, je vous conseille d'aller sur le site cité tout en haut et de jouer un peu :)