DEV Community

mmvergara
mmvergara

Posted on

1 2 1 2 1

Unraveling the "===" of javascript

The behavior of the strict equality operator (===) is defined in the ECMAScript specification under the section Strict Equality Comparison. Here’s a breakdown of how it works, step by step:

The Algorithm for ===

When you use ===, JavaScript follows this algorithm to determine if two values are equal:

  1. Check if the types are the same:
  • If the types of the two values are different, return false.
  • If the types are the same, proceed to the next step.
  1. Compare the values based on their type:
  • Numbers:

    • If both values are NaN, return false (yes, NaN === NaN is false!).
    • If the numbers have the same numeric value, return true.
    • If one value is +0 and the other is -0, return true (they are considered equal).
  • Strings:

    • If both strings have the same sequence of characters, return true.
    • Otherwise, return false.
  • Booleans:

    • If both values are true or both are false, return true.
    • Otherwise, return false.
  • Objects (including arrays and functions):

    • If both values reference the same object in memory, return true.
    • Otherwise, return false.
  • null and undefined:

    • null === null is true.
    • undefined === undefined is true.
    • null === undefined is false (they are different types).

Why NaN === NaN is false

This is a common point of confusion. According to the spec, NaN (Not-a-Number) is defined as not equal to itself. This is because NaN represents an invalid or undefined numeric result, and it doesn’t make sense to compare two invalid results as equal.

For example:

NaN === NaN; // false
Enter fullscreen mode Exit fullscreen mode

If you need to check if a value is NaN, use Number.isNaN() or Object.is():

Number.isNaN(NaN); // true
Object.is(NaN, NaN); // true
Enter fullscreen mode Exit fullscreen mode

Why +0 === -0 is true

The spec treats +0 and -0 as equal because, in most cases, they behave the same way in mathematical operations. However, there are rare scenarios where they differ (e.g., 1 / +0 is Infinity, while 1 / -0 is -Infinity). If you need to distinguish between them, use Object.is():

Object.is(+0, -0); // false
Enter fullscreen mode Exit fullscreen mode

Objects and Reference Equality

When comparing objects (including arrays and functions), === checks if they reference the same object in memory. This is why two objects with identical contents are not considered equal:

const obj1 = { name: "Alice" };
const obj2 = { name: "Alice" };
obj1 === obj2; // false (different objects)
Enter fullscreen mode Exit fullscreen mode

But if two variables point to the same object, they are equal:

const obj3 = obj1;
obj1 === obj3; // true (same object)
Enter fullscreen mode Exit fullscreen mode

More on Solidifying Javascript Foundations

Billboard image

Deploy and scale your apps on AWS and GCP with a world class developer experience

Coherence makes it easy to set up and maintain cloud infrastructure. Harness the extensibility, compliance and cost efficiency of the cloud.

Learn more

Top comments (0)

Eliminate Context Switching and Maximize Productivity

Pieces.app

Pieces Copilot is your personalized workflow assistant, working alongside your favorite apps. Ask questions about entire repositories, generate contextualized code, save and reuse useful snippets, and streamline your development process.

Learn more

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay