Which equals operator should I use in JavaScript comparisons? (== vs ===)

Comparing things in JavaScript == vs ===, which should I use?

If === is not equal to == then what does it equal???

Huh?

Let’s break it down

First, let us define the two operators:

• === is known as the Strict Equality Operator
• == is the Abstract Equality Operator

They both behave the same, in that they both return a boolean value telling us if two expressions are equal.

A === B // returns true or false
Y == Z  // also returns true or false

The difference is that the Strict Equality Operator (===) does no type conversion (also called type coercion).

1 == "1" // returns true

1 === "1" // returns false as the type is not equal

This means that for two expressions to be equal, they must be both the equivalent value AND of the same type.

NOTE: The same goes for inequality checks, != has a Strict Equality counterpart !==.

Let’s look at some examples

What does this mean in reality?

The first four examples don’t really look too different from each other. In each of these cases we are comparing variables of equal type.

This satisfies the criteria of the Strict Equality Operator (===), where both the values are equal AND the same type.

It gets interesting when we begin comparing variables of different type. Lets take this example, comparing 0 (a Number) to false (a Boolean):

0 == false   // This will return true
0 === false  // This will return false 

Here, the Abstract Equality Operator (==) can convert both variables to the same type and then check their equality.

Since 0 is the equivalent of false, when converted to a boolean, both sides of the equation are equal.

Our Strict Equality Operator (===), however, does no type conversion and determines that Number is not equal to Boolean and therefore both sides of the equation are not equal.

This is not only for boolean values, as you can see on the table, 100 (a Number) and "100" (a String) are classed as equal by the Abstract Equality Operator (==), but not by the Strict Equality Operator (===).

So which should I use in my code??

In my opinion, and the opinion of many others with more experience, it’s best to stay with the Strict Equality Operator (===).

It’s very explicit how it works and doesn’t require you to remember lots of crazy edge cases.

The Abstract Equality Operator (==) does not always work as you intend, unless you fully understand all possible outcomes, and there are some pretty funky results.

To quote Douglas Crockford, writer of “JavaScript: The Good Parts”:

JavaScript has two sets of equality operators: === and !==, and their evil twins == and !=. The good ones work the way you would expect. If the two operands are of the same type and have the same value, then === produces true and !== produces false. The evil twins do the right thing when the operands are of the same type, but if they are of different types, they attempt to coerce the values. the rules by which they do that are complicated and unmemorable.

Finally, if you find yourself in a situation where you aren’t confident in the type equality of your variables, then it can help to be explicit and coerce/convert the type first yourself.

e.g. imagine a scenario where you are checking the equality of two numbers, but one may be of type string OR a number, force its value to number yourself:

const someValue = VariableA === Number(VariableB)

References:

• JavaScript: The Good Parts by Douglas Crockford
• JavaScript Equality Table by dorey
• Stack Overflow as always…

Other Articles: