Two equality operands (== and ===) in JavaScript

Two equality operands (== and ===) in JavaScript Do you use == or === in JavaScript? Or does it depend? Do you know what is the difference between them? I decided to write something about it because I think it is important to know those things when you create JavaScript code. Once I heard == and === in JavaScript are like == and equal in Java. This is far from the truth. Or actually it could be said that using == in JavaScript and == for comparing Strings in Java is WRONG.

equalityDo you use == or === in JavaScript? Or does it depend? Do you know what is the difference between them? I decided to write something about it because I think it is important to know those things when you create JavaScript code. Once I heard == and === in JavaScript are like == and equal in Java. This is far from the truth. Or actually it could be said that using == in JavaScript and == for comparing Strings in Java is WRONG.

 

What is the difference between == and ===?

The former (==) is called double equals or loose equality. It converts the left and the right argument to the same data type and then compares them. Before the comparison both arguments must be the same type and it does not mean that always one conversion is enough. It is possible that the first common type is none of them so both arguments must be converted.

The latter (===) is called triple equals or strict equality. It just compares two arguments. If types are different, no conversion attempt takes place - the result is false.

Comparing variables or constants of the same type works the same in both cases:

== ===
Expr. Result Expr. Result
123==123 true 123===123 true
'abc'=='abc' true 'abc'==='abc' true
1.3==1.3 true 1.3==1.3 true

var a=7;
var b=7;
a==b

true var a=7;
var b=7;
a===b
true
123==124 false 123==124 false
"xyz"=="g" false "xyz"=="g" false

If types of arguments are different it is not difficult either. The strict equality operand returns false and in turn the loose equality operand tries to convert to a common type and then compares like the strict one.

== ===
Expr. Result Expr. Result
123=='123' true 123==='123' false
'4.2'==4.2 true '4.2'===4.2 false

var a=7;
var b='7';
a==b

true var a=7;
var b='7';
a===b
false

 

Which one to use?

So far so good. It seems like it is a matter of a personal preference or fit to a particular case. I could agree if there did not exist some specific behavior of the loose equality operand in corner cases - the devil's in the detail. The below comparison would be false if the strict operand was used but the loose one returns ... hmm ... surprisingly true.

0 == ''

'0' == false

null == undefined

' ' == 0

[5,1] == '5,1'

Such turn of events is surprising or not. We could argue about it but for me it is unnecessary taste of JavaScript which is hard for me to rave about.

All of it leads me to a conclusion that the loose equality (==) should be avoided which are:

  • not obvious corner cases
  • type conversion performance overhead

 

If you want to check your understanding of this post, see question #1 of the quiz.

quiz