If you work in javascript, these results shouldn’t be surprising

photo credit: /doh via photopin (license)
photo credit: /doh via photopin (license)

Hey Folks,

Javascript has some weird stuff built into it and sometimes when used in conjunction with other languages, it is easier to forget the corner cases that can come with javascript coding.

Here I compile the list checks, that every developer working in javascript should know, so that there are no accidental bugs and also sometimes these can be use to our advantage

Equal operator comparison

Double Equals

Comparison Result
null == null true
null == undefined true
null == 0 false
null == ” (empty string) false
null == NaN false
null == ‘2’ false
null == 2 false
undefined == null true
undefined == undefined true
undefined == 0 false
undefined == ” (empty string) false
undefined == NaN false
undefined == ‘2’ false
undefined == 2 false
0 == null false
0 == undefined false
0 == 0 true
0 == ” (empty string) true
0 == NaN false
0 == ‘2’ false
0 == 2 false
” (empty string) == null false
” (empty string) == undefined false
” (empty string) == 0 true
” (empty string) == ” (empty string) true
” (empty string) == NaN false
” (empty string) == ‘2’ false
” (empty string) == 2 false
NaN == null false
NaN == undefined false
NaN == 0 false
NaN == ” (empty string) false
NaN == NaN false
NaN == ‘2’ false
NaN == 2 false
‘2’ == null false
‘2’ == undefined false
‘2’ == 0 false
‘2’ == ” (empty string) false
‘2’ == NaN false
‘2’ == ‘2’ true
‘2’ == 2 true
2 == null false
2 == undefined false
2 == 0 false
2 == ” (empty string) false
2 == NaN false
2 == ‘2’ true
2 == 2 true

Double equals is not the same as triple equals when it comes to javascript. Notice that some things are unexpectedly true example 0 == “” is true when only compared with double equals vs its false when compared with triple equals. Double equals can somehow be helpful when you want to check if the value is either null or undefined you can quickly just do if(val == null) instead of if(val == null || val == undefined). Also notice that double equals does not check for the data type behind the comparator, example 2 == ‘2’ is true but not true in triple equals.

Triple Equals

Comparison Result
null === null true
null === undefined false
null === 0 false
null === ” (empty string) false
null === NaN false
null === ‘2’ false
null === 2 false
undefined === null false
undefined === undefined true
undefined === 0 false
undefined === ” (empty string) false
undefined === NaN false
undefined === ‘2’ false
undefined === 2 false
0 === null false
0 === undefined false
0 === 0 true
0 === ” (empty string) false
0 === NaN false
0 === ‘2’ false
0 === 2 false
” (empty string) === null false
” (empty string) === undefined false
” (empty string) === 0 false
” (empty string) === ” (empty string) true
” (empty string) === NaN false
” (empty string) === ‘2’ false
” (empty string) === 2 false
NaN === null false
NaN === undefined false
NaN === 0 false
NaN === ” (empty string) false
NaN === NaN false
NaN === ‘2’ false
NaN === 2 false
‘2’ === null false
‘2’ === undefined false
‘2’ === 0 false
‘2’ === ” (empty string) false
‘2’ === NaN false
‘2’ === ‘2’ true
‘2’ === 2 false
2 === null false
2 === undefined false
2 === 0 false
2 === ” (empty string) false
2 === NaN false
2 === ‘2’ false
2 === 2 true

Triple equals is much tighter comparison in javascript, it also checks the data type example see that 2 === ‘2’ is false while its true in double equals


Or (||) operator comparison

Comparison Result
null || null null
null || undefined undefined
null || 0 0
null || ” (empty string) ” (empty string)
null || NaN NaN
null || ‘2’ 2
null || 2 2
undefined || null null
undefined || undefined undefined
undefined || 0 0
undefined || ” (empty string) ” (empty string)
undefined || NaN NaN
undefined || ‘2’ 2
undefined || 2 2
0 || null null
0 || undefined undefined
0 || 0 0
0 || ” (empty string) ” (empty string)
0 || NaN NaN
0 || ‘2’ 2
0 || 2 2
” (empty string) || null null
” (empty string) || undefined undefined
” (empty string) || 0 0
” (empty string) || ” (empty string) ” (empty string)
” (empty string) || NaN NaN
” (empty string) || ‘2’ 2
” (empty string) || 2 2
NaN || null null
NaN || undefined undefined
NaN || 0 0
NaN || ” (empty string) ” (empty string)
NaN || NaN NaN
NaN || ‘2’ ‘2’
NaN || 2 2
‘2’ || null ‘2’
‘2’ || undefined ‘2’
‘2’ || 0 ‘2’
‘2’ || ” (empty string) ‘2’
‘2’ || NaN ‘2’
‘2’ || ‘2’ ‘2’
‘2’ || 2 ‘2’
2 || null 2
2 || undefined 2
2 || 0 2
2 || ” (empty string) 2
2 || NaN 2
2 || ‘2’ 2
2 || 2 2

This works like standard || or operator, if the value of the first comparator does not equals to true it will select the other value. See section truthy value for which values return false when asked for boolean value.

Truthy value

Comparision Result
if ( null ) false
if ( undefined ) false
if ( 0 ) false
if ( ” (empty string) ) false
if ( NaN ) false
if ( ‘2’ ) true
if ( 2 ) true

Hopefully this can help someone have a reference check on what javascript does on == , === and || operators.

Let me know in comments..

  PS: I originally created this post in jsfiddle here (http://jsfiddle.net/bsurela/13gdvom5/)

Leave a Reply

Your email address will not be published. Required fields are marked *