Equality: ===, == and Object.is

JavaScript has three ways to ask “are these the same?”, and they disagree in a few cases. This lesson shows the differences and the rule that keeps you out of trouble. The idea of identity versus equality is general, and the fundamentals lesson on records and objects introduces it. Here it takes JavaScript’s form.

Strict equality: ===

a === b is true when the two values have the same type and the same value. There is no conversion. Different types are never strictly equal.

!== is its opposite. Use these two operators by default.

Loose equality: ==

a == b first converts the values to a common type when their types differ, then compares. It follows the coercion rules from the previous lesson, which makes it hard to predict.

console.log("1 === '1'  ", 1 === "1");
console.log("1 == '1'   ", 1 == "1");
console.log("0 == ''    ", 0 == "");
console.log("0 == '0'   ", 0 == "0");
console.log("'' == '0'  ", "" == "0");
console.log("false == '0'", false == "0");
console.log("null == undefined", null == undefined);
console.log("null === undefined", null === undefined);
console.log("null == 0  ", null == 0);
console.log("[] == false", [] == false);
console.log("[1] == 1   ", [1] == 1);
console.log("NaN == NaN ", NaN == NaN);

1 === '1'   false
1 == '1'    true
0 == ''     true
0 == '0'    true
'' == '0'   false
false == '0' true
null == undefined true
null === undefined false
null == 0   false
[] == false true
[1] == 1    true
NaN == NaN  false

The results break the rule that equality is transitive: 0 == "" and 0 == "0" are both true, yet "" == "0" is false. [] == false is true, because both sides turn into 0.

The rules are easy to describe but not worth memorising:

• If the types match, == behaves like ===.
• null == undefined is true, and neither equals anything else.
• Otherwise, if one side is a number and the other text, boolean or object, they are converted towards numbers.
• NaN is not equal to anything, including itself.

One use of == is accepted widely, and it is the check against null: value == null is true for exactly null and undefined, and nothing else.

console.log(null == null, undefined == null);
console.log(0 == null, "" == null, false == null, NaN == null);

true true
false false false false

Many teams ban == entirely and write value === null || value === undefined instead. Either is fine, as long as your team agrees. Everywhere else, use ===.

NaN and Object.is

NaN === NaN is false. The test for it is Number.isNaN(value). Object.is(a, b) is a third comparison that behaves like ===, except that it treats NaN as equal to itself and tells 0 from -0.

console.log(NaN === NaN, Object.is(NaN, NaN), Number.isNaN(NaN));
console.log(0 === -0, Object.is(0, -0));
console.log([NaN].includes(NaN), [NaN].indexOf(NaN));
console.log(Object.is("a", "a"), Object.is(1, 1));

false true true
true false
true -1
true true

Note the last array line: includes finds NaN, while indexOf does not, because indexOf uses ===. You will rarely need Object.is directly, but it is the right tool when NaN or -0 matters.

Objects compare by reference

For objects, arrays and functions, === asks whether both sides are the very same object in memory, not whether they look alike. Two separately created arrays with the same items are different objects.

const a = [1, 2];
const b = [1, 2];
const c = a;

console.log(a === b, a === c);
console.log({} === {});

c.push(3);
console.log(a);

false true
false
[ 1, 2, 3 ]

c = a copies the reference, so a and c are one array under two names, and c.push(3) shows up through a. Two literals {} and {} are two objects.

To compare contents, you must write the comparison yourself, such as checking each position:

const x = [1, 2];
const y = [1, 2];
const z = [2, 1];

console.log(x[0] === y[0] && x[1] === y[1]);
console.log(x[0] === z[0] && x[1] === z[1]);

true
false

This only works for two-item lists. Once you know loops and array methods, you can write a comparison that works for any length. For nested data you need to compare recursively. Comparing with JSON.stringify(a) === JSON.stringify(b) is a shortcut that works for plain data only. It depends on key order and breaks on undefined, NaN, and values JSON cannot hold.

Common pitfalls

• Using == and trusting it. "" == 0 is true and "" == "0" is false.
• Comparing arrays or objects with === to find out if they hold the same data. They are only equal if they are the same object.
• Testing x === NaN. It is always false. Use Number.isNaN(x).
• Comparing input text with a number. "5" === 5 is false. Convert the input first.

const input = "5";
const name = "";
const flag = true;
const nothing = undefined;
const list = [];

console.log(Number(input) === 5);
console.log(String(5) === "5");
console.log(name === "");
console.log(flag);
console.log(nothing === null || nothing === undefined);
console.log(list.length === 0);
console.log(Number.isNaN(Number("abc")));
console.log(Number(name) === 0);

true
true
true
true
true
true
true
true

console.log([] === []);
console.log([NaN].includes(NaN));
console.log(Object.is(0, -0));
console.log(null == 0);
console.log(null >= 0);

false
true
false
false
true

console.log("" === 0);
console.log("1" == 1);
console.log(undefined == null);
console.log(undefined === null);
console.log("a" < "b");
console.log("B" < "a");

false
true
true
false
true
true

Summary

• Use === and !== by default. == converts types first, with results that are hard to predict. The single accepted use is value == null.
• NaN equals nothing, itself included. Use Number.isNaN. Object.is also tells 0 from -0.
• Objects and arrays compare by reference. Two arrays with the same items are not ===.

Next: null, undefined, ?? and ?..