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.
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; |
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; |
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.
