The Difference Between == and === in JavaScript

In JavaScript, there are two types of equality operators used to compare values: == and ===. While both operators are used to compare values, there is a significant difference between the way the two of them behave and the results they return. You would be surprised how often even well‑versed developers can be tripped up by these, so I thought I'd write an article to discuss the differences between the two operators, and when to use each of them.

Abstract equality operator (==)

The == operator, also known as the "abstract equality operator," compares two values by converting the operands to the same type before the comparison ‑ a process known as type coercion. If the operands are of different types, JavaScript will attempt to convert one or both operands to a compatible type.

For example:

console.log(1 == '1');  //=> trueconsole.log(true == 1);  //=> trueconsole.log(null == undefined);  //=> true

To offer some explanation to these examples: the == operator converts the operands to the same type before comparison.

In the first example, the number 1 is converted to a string before the comparison. In the second example, the boolean value true is converted to the number 1 before the comparison. And in the third example, both null and undefined are considered to be equal.

Strict equality operator (===)

On the other hand, the === operator, also known as the "strict equality operator," compares two values without type coercion. If the operands are of different types, the comparison will return false.

For example:

console.log(1 === '1');  //=> falseconsole.log(true === 1);  //=> falseconsole.log(null === undefined);  //=> false

As you can see from these examples, the === operator does not convert the operands to the same type before comparison.

In the first example, the comparison returns false because the number 1 is not equal to the string '1'. In the second example, the comparison returns false because the boolean value true is not equal to the number 1. And in the third example, the comparison returns false because null and undefined are not the same type.

The Wrap‑Up

In most cases, it is recommended that you use the === strict operator for equality comparisons, as it avoids unexpected behaviour due to type coercion. However, there may be cases where type coercion is desired, in which case the == operator can ‑ of course ‑ be used.

console.log(1 == '1');  //=> trueconsole.log(1 === '1');  //=> falseconsole.log(true == 1);  //=> trueconsole.log(true === 1);  //=> falseconsole.log(null == undefined);  //=> trueconsole.log(null === undefined);  //=> false

In conclusion, the main difference between the == and === operators in JavaScript is that the == operator performs type coercion before comparison, whilst the === operator does not, and is stricter as a result.