DEV Community

mmvergara
mmvergara

Posted on

1 1 1 1 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

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay