Should I use === or == equality comparison operator in JavaScript?


Compare equal and of same type with ===

Complex type conversions take place with ==

Only use ===

You know there are two different equality comparison operators in JavaScript: the === and == operators, or the triple equals and double equals as they're called. You’ve seen both used but aren't sure which one to pick for your code. You'd like to know a sure fire way to decide over one or the other.

As it turns out, there is a straightforward way to decide which one to use. And the same logic works for inequality comparison operators !== and != as well.

Compare equal and of same type with ===

x === y

The triple equals operator (===) returns true if both operands are of the same type and contain the same value. If comparing different types for equality, the result is false.

This definition of equality is enough for most use cases. When comparing the string "0" and the number 0 the result is false as expected.

Sources such as D. Crockford and MDN both advise that only triple equals operator should be used when programming in JavaScript and double equals operator be ignored altogether.

Complex type conversions take place with ==

x == y

The double equals operator (==) tries to perform type conversion if the types differ and then compare for equality. If the types differ, either or both operands are first converted to a common type. The conversion rules are complex and depend on the argument types. For a full comparison table, see for example MDN or the ECMAScript specification.

For example, when comparing the string "0" and the number 0, the first argument is first converted to a number.

"0" == 0 // becomes
ToNumber("0") === 0

While the string and number comparison is understandable, the complex rules for other types lead to illogical results. For example, see the comparisons between null, undefined and false:

false == undefined // false
false == null      // false
null == undefined  // true

Only use ===

Use the triple equals (===) equality comparison operator. When trying to compare different types with triple equals, the result is always false. You will get the results you expect that are not subject to hard to memorize conversion rules. Comparing apples to oranges is false as expected.

Note that these comparison operators are for comparing primitive types. For comparing deep equality of objects or arrays a different approach is needed that compares the operands structurally.

Semantic Versioning Cheatsheet

Semantic Versioning Cheatsheet

Learn the difference between caret (^) and tilde (~) in package.json.

Get Cheatsheet

Loading Comments