softare development

Why [] === [] Returns false in JavaScript (And How to Properly Compare Arrays & Objects)

JavaScript can sometimes behave in unexpected ways, especially when comparing arrays and objects. If you’ve ever wondered why [] === [] evaluates to false, this guide explains the reason and provides practical solutions for comparing arrays and objects correctly. See Optional Chaining (?.): How to Avoid ‘Cannot Read Property’ Errors in JavaScript

1. Why [] === [] is false in JavaScript

The Root Cause: Reference vs. Value Comparison

In JavaScript, arrays and objects are reference types, meaning:

  • When you create an array ([]) or object ({}), JavaScript stores it in memory and returns a reference (memory address) to it.
  • The === (strict equality) operator checks if two variables point to the same memory location, not if their contents are identical.
const arr1 = [];  
const arr2 = [];  

console.log(arr1 === arr2); // false (different memory references)  
console.log(arr1 === arr1); // true (same reference)  

How Primitive Types Differ

Unlike arrays/objects, primitives (numbers, strings, booleans, etc.) are compared by value:

console.log(5 === 5); // true  
console.log("hello" === "hello"); // true  

2. How to Compare Arrays & Objects Properly

Since === doesn’t work for deep comparisons, here are alternative methods:

See Recursion For Beginners

A. Comparing Arrays

Method 1: JSON.stringify() (Simple, but Limited)

Converts arrays to strings for comparison:

const arr1 = [1, 2, 3];  
const arr2 = [1, 2, 3];  

console.log(JSON.stringify(arr1) === JSON.stringify(arr2)); // true  


Limitation: Fails if elements are in different orders or contain undefined/functions.

Method 2: Manual Loop Check (More Reliable)

Compare each element individually:

function areArraysEqual(arr1, arr2) {  
  if (arr1.length !== arr2.length) return false;  
  return arr1.every((item, index) => item === arr2[index]);  
}  

console.log(areArraysEqual([1, 2], [1, 2])); // true  
console.log(areArraysEqual([1, 2], [2, 1])); // false (order matters)  

Method 3: Using lodash.isEqual (Best for Complex Arrays)

The Lodash library provides deep comparison:

import _ from 'lodash';  

console.log(_.isEqual([1, 2], [1, 2])); // true  

B. Comparing Objects

Method 1: JSON.stringify() (Works for Simple Objects)

const obj1 = { name: "Alice" };  
const obj2 = { name: "Alice" };  

console.log(JSON.stringify(obj1) === JSON.stringify(obj2)); // true  


Limitation: Fails if properties are in different orders.

Method 2: Manual Key-Value Check

function areObjectsEqual(obj1, obj2) {  
  const keys1 = Object.keys(obj1);  
  const keys2 = Object.keys(obj2);  

  if (keys1.length !== keys2.length) return false;  
  return keys1.every(key => obj1[key] === obj2[key]);  
}  

console.log(areObjectsEqual({ a: 1 }, { a: 1 })); // true  

Method 3: Using lodash.isEqual (Best for Nested Objects)

console.log(_.isEqual({ a: 1 }, { a: 1 })); // true  

3. Key Takeaways

[] === [] is false because arrays/objects are compared by reference, not content.
Use JSON.stringify() for simple comparisons (but be cautious with order/undefined).
For deep comparisons, use lodash.isEqual or write a custom function.
Primitives (5, "hello") compare by value, so === works as expected.

Final Tip: When to Use Each Method

CaseBest Approach
Simple arrays/objectsJSON.stringify()
Order-sensitive arraysManual loop check
Complex/nested objectslodash.isEqual()
Performance-criticalCustom comparison function

Now you know why [] === [] is false—and how to compare arrays & objects properly! 🚀

Recent Posts

Recursion for Beginners

Recursion is a programming technique where a function calls itself to solve smaller instances of…

3 days ago

Optional Chaining (?.): How to Avoid ‘Cannot Read Property’ Errors in JavaScript

One of the most common errors in JavaScript is the dreaded TypeError: Cannot read property…

5 days ago

ReferenceError vs. TypeError: What’s the Difference?

When debugging JavaScript, you’ll often encounter ReferenceError and TypeError. While both indicate something went wrong,…

1 week ago

document.querySelector() vs. getElementById(): Which is Faster?

When selecting DOM elements in JavaScript, two common methods are document.querySelector() and document.getElementById(). But which…

1 week ago

npm vs. Yarn: Which Package Manager Should You Use in 2025?

When starting a JavaScript project, one of the first decisions you’ll face is: Should I…

1 week ago

Why Learn Software Development? (And Where to Start)

Software development is one of the most valuable skills you can learn. From building websites…

2 weeks ago