JavaScript
Arrays
Programming
Coding Tips
Web Development

How to compare arrays in JavaScript?

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

Comparing arrays in JavaScript is tricky because arrays are objects, and object equality is based on references, not contents. Two arrays that look identical can still compare as different values if they are stored at different memory locations.

Reference Equality Versus Value Equality

This is the first thing to understand:

javascript
1const a = [1, 2, 3];
2const b = [1, 2, 3];
3const c = a;
4
5console.log(a === b); // false
6console.log(a === c); // true

a === b is false because they are different array objects. a === c is true because both variables point to the same array.

If what you really want is content equality, you need custom comparison logic.

Comparing Flat Arrays in Order

For arrays of primitive values where order matters, compare lengths first and then compare each element.

javascript
1function arraysEqual(left, right) {
2  if (left.length !== right.length) {
3    return false;
4  }
5
6  for (let i = 0; i < left.length; i += 1) {
7    if (left[i] !== right[i]) {
8      return false;
9    }
10  }
11
12  return true;
13}
14
15console.log(arraysEqual([1, 2, 3], [1, 2, 3])); // true
16console.log(arraysEqual([1, 2, 3], [3, 2, 1])); // false

This is the right solution for many day-to-day cases because it is explicit and fast.

Using every

If you prefer a more declarative style, Array.prototype.every gives the same behavior with less loop syntax:

javascript
1function arraysEqual(left, right) {
2  return (
3    left.length === right.length &&
4    left.every((value, index) => value === right[index])
5  );
6}

This still performs an ordered, shallow comparison. Nested arrays and objects need more than ===.

Deep Comparison for Nested Arrays

When arrays can contain other arrays or plain objects, you need recursion. A simple deep-equality helper might look like this:

javascript
1function deepEqual(left, right) {
2  if (left === right) {
3    return true;
4  }
5
6  if (Array.isArray(left) && Array.isArray(right)) {
7    if (left.length !== right.length) {
8      return false;
9    }
10
11    return left.every((value, index) => deepEqual(value, right[index]));
12  }
13
14  if (
15    left &&
16    right &&
17    typeof left === "object" &&
18    typeof right === "object"
19  ) {
20    const leftKeys = Object.keys(left);
21    const rightKeys = Object.keys(right);
22
23    if (leftKeys.length !== rightKeys.length) {
24      return false;
25    }
26
27    return leftKeys.every((key) => deepEqual(left[key], right[key]));
28  }
29
30  return false;
31}
32
33console.log(deepEqual([1, [2, 3]], [1, [2, 3]])); // true
34console.log(deepEqual([1, { x: 2 }], [1, { x: 2 }])); // true
35console.log(deepEqual([1, { x: 2 }], [1, { x: 3 }])); // false

This kind of helper is useful when you control the data shape and do not want an external dependency.

Is JSON.stringify Good Enough

JSON.stringify is tempting because it is short:

javascript
const same = JSON.stringify([1, 2, 3]) === JSON.stringify([1, 2, 3]);
console.log(same);

It can work for simple arrays of primitives, but it is fragile as a general solution. It depends on serialization details, drops unsupported values such as functions, and does not express your intent clearly. It is best treated as a quick debugging shortcut, not a reusable equality strategy.

When Order Does Not Matter

Sometimes you are not comparing arrays as ordered sequences. You are comparing them as bags or sets of values. In that case, sort first or use frequency counting.

javascript
1function sameMembers(left, right) {
2  if (left.length !== right.length) {
3    return false;
4  }
5
6  const sortedLeft = [...left].sort();
7  const sortedRight = [...right].sort();
8
9  return sortedLeft.every((value, index) => value === sortedRight[index]);
10}
11
12console.log(sameMembers(["b", "a"], ["a", "b"])); // true

That is a different question from ordered equality, so the comparison rule should be chosen deliberately.

Common Pitfalls

The biggest pitfall is using === and expecting content comparison. In JavaScript, that only checks whether both variables reference the same array.

Another problem is forgetting to compare lengths first. Without that check, some implementations accidentally report equality for arrays that share a prefix but have different sizes.

JSON.stringify also causes subtle bugs when array elements are objects whose property order or serializability is not guaranteed. It looks convenient, but it is often the wrong abstraction.

Finally, be explicit about whether order matters. Comparing [1, 2, 3] and [3, 2, 1] should return false for sequence equality and true only for set-like equality.

Summary

  • '=== compares array references, not contents.'
  • For flat ordered arrays, compare lengths and corresponding elements.
  • 'every is a concise way to implement shallow ordered equality.'
  • Nested arrays or objects require deep comparison logic or a library.
  • Decide whether you want sequence equality or set-like equality before choosing an approach.

Course illustration
Course illustration

All Rights Reserved.