Object.is(+0,-0) is true, Object.is(NaN,NaN) is true; compare to ===

ES6: Object.is() vs. === in JavaScript

ES6 (ECMAScript 2015) added a helper function called Object.is() that is slightly different from the === operator.

The triple equality operator === is the trusty stand-by for testing equality in JavaScript, being dutifully used daily by developers everywhere.

In fact, === has been the preferred method of equality comparison over its type-coercing friend == since the very beginning, JavaScript 1.0! 💯

ECMAScript 6th Edition (ES6, or ES2015) added an additional comparison operator that has slightly different behavior compared to ===.

That new method is called Object.is() and is something you should know about, in case it pops up in your JavaScript, like it does in React! 😁

The 2 differences between === and Object.is()

“[The] Object.is() method is used to determine whether two values are the same or not. […] The == and === operator treats the number values +0 and -0 as equal whereas Object.is() method treats them as not equal. Apart from that the == and === operator does not treat Number.Nan [sic] equal to Nan [sic].” — Geeks for Geeks

Let’s put that in code, shall we?

1 — Negative Zero

The unusual JavaScript number negative zero >-0 is usually considered equal to positive zero +0, but they are technically different values.

Object.is() can tell them apart, returning false for the comparison between -0 and +0, in case that ever comes up:

2 — NaN

NaN represents the value “not a number” and equivalently represented by NaN or Number.NaN.

NaN is the only number that does not equal itself in JavaScript, but NaN is considered to be the same value as itself using Object.is():

Object.is(+0,0) is false, Object.is(NaN,NaN) is true

So Object.is() is just === with different behavior for negative zero -0 and NaN — good to know!

As an ES6 feature, it may not be supported by older browsers, but it can be transpiled using Babel for compatibility.

In the next section, I compare Object.is() to the == operator then speculate why React uses Object.is() under the hood.

The difference between == and ===

The double and triple equality operators behave differently, so it is important to note that Object.is() behaves like ===, the strict equality operator, not like == , the loose equality operator.

“Remember, the main difference between == and === operators is that == compares variables but performs type coercion. But === doesn’t do that. It checks not only the values but also types of two variables.”

— gravity well in JavaScript in Plain English

So that means that Object.is() will not perform type coercion.

Confused? Try my article on the differences between == and ===:

A real world example of Object.is()

React developers know that one of the key features of React is that the component is re-rendered when the state is updated.

Here’s how that works, using React Hooks or a class component:

“The setCount method returned by the useState hook works similar to this.setState in the class component. They both pass the updated state to react and enqueue a re-render.

However, there is a difference — In case of setState, React will always re-render the component and it’s children(unless the shouldComponentUpdate lifecycle method returns false). With setCount, React will bail out on an update if the updated state passed is same as previous state. React uses Object.is algorithm to compare the state.”

— Avinash Ega in The Startup

Note the use of Object.is(). This potentially keeps React from infinitely re-rendering a component when given a NaN value, which would never equal itself using ===, as I explored in my article on checking for NaN:

Conclusion

The method Object.is() works the same as === for almost all intents and purposes, with just two key differences.

The first difference is that Object.is() thinks -0 and +0 are different values, while === says they are the same value.

The second difference between is that Object.is thinks NaN is the same value as itself, while === says they are not same value.

React is an example of Object.is() being used in the wild. Happy coding!

Further reading:

• Author gravity well has an article in JavaScript in Plain English on the topic of comparing objects:

• Kyle Ross has an article on CoderWall.com about checking for an empty JavaScript object:

• Tarek Al Qaddy has an article on JSTips.co advocating for using Object.is() for equality comparison:

Dr. Derek Austin is the author of Career Programming: How You Can Become a Successful 6-Figure Programmer in 6 Months, now available on Amazon.