Whether you are coming from a different programming language like C# or you are a brand new programmer learning about JavaScript, you have probably seen different JavaScript codebases using in some cases double equals (==) and in other cases using triple equals (===). Although they seem similar at first, it is important to understand the differences between the two.
Table of Contents
Using Double Equals (==)
When using double equals (==), JavaScript checks the equality between two values in a loose way.
What does loose way mean?
Let me explain using the following example:
function doubleEqualsExample() {
if (0 == false) {
console.log('it will display this message');
} else {
console.log('it will not display this message');
}
);
// running our function should always log "it will display this message"
doubleEqualsExample();
If we running the code in our previous example, our function doubleEqualsExample() will always display the same message “it will display this message”.
This looks weird at first as we clearly know that 0 is not equal to false. One is a number, false is a boolean. They are not even the same data type.
What is happening in here?
Remember I mentioned about == performing a loose equality check? What is happening behind the scenes when using == is JavaScript converts one of the two values, in our example 0 and false to a common data type.
Therefore, JavaScript can convert 0 into a boolean.
Boolean(0); // converts 0 to false
Boolean(1); // converts 1 to true
Boolean(24); // converts 24 to true
or false into a Number
Number(false); // converts false to 0
Number(true); // converts true to 1
Once this conversion happens, we will have two values with the same data type. Since our doubleEqualsExample() was using the (0 == false), this will happen:
- 0 will be converted to a Boolean, making it a false. Hence, our comparison will be
false == false. - false will be converted to Number, making it a 0 .Hence, our comparison will be 0 == 0.
Using Triple Equals (===)
When using triple equals (==), JavaScript checks the equality between two values in a strict way.
What does strict way mean?
Let’s see the following example:
Our function tripleEqualsExample() will always log the message “it will be false equality”. Unlike using double equals, JavaScript doesn’t convert the data types to a common data type when using triple equals.
Having said that, anyone who reads “is 0 equal to false” will get the expected value of false.
Which one Should I Use (== or ===)?
After several years working with JavaScript, using it from small to large enterprise projects, your best bet is to go use triple equals (===). One of the reasons why it is recommended to use === is because it removes the ambiguity that generates among developers.
If you have several to run several equality comparisons between different data types (Strings, Numbers, and Boolean, etc) such as the following:
console.log(1 === true); // it will be false;
console.log('1' === 1); // it will be false;
console.log(0 === false); // it will be false;
console.log([1, 2] === '1,2'); // it will be false;
As a developer, you are certain that a comparison between two different data types will fail. If that wasn’t the case, and we have the following comparisons:
console.log(1 == true); // it will be true;
console.log('1' == 1); // it will be true;
console.log(0 == false); // it will be true;
console.log([1, 2] == '1,2'); // it will be true;
Developers expecting a specific behavior will get unexpected behavior. On top of that, it will make harder the process of finding the bug as reading the equality comparison with a naked eye looks correct, even though it is programmatically incorrect.
Conclusion: Double Equals is for Loosers…
From personal experiences, == represent more trouble than what its worth using it. However, if you understand well enough how JavaScript works and your code doesn’t deal with equality comparisons between different data types, it is ok to use == as well.