How to Compare Two JavaScrpt Arrays

To compare two Arrays in JavaScript, you should check that the length of both arrays should be the same, the objects presented in it be the same type, and each item in one array is equivalent to the counterpart in the compared array.

This tutorial will show you some ways of comparing two arrays.

The Array.prototype.equals() Method

A faster method can be looping through the arrays and comparing each value:

// Warn if overriding existing method

if (Array.prototype.equals){
  console.warn("Overriding existing Array.prototype.equals. The possible causes: New API specifies the method, there's a framework conflict or there are double inclusions in the code.");
}
// attach the .equals method to invoke it on any array

Array.prototype.equals = function (arr) {
  // if the other array is falsy, return

  if (!arr){
    return false;
  }

  // compare lengths 
  if (this.length != arr.length){
    return false;
  }

  for (var i = 0, l = this.length; i < l; i++) {
    // check if you have nested arrays
    if (this[i] instanceof Array && arr[i] instanceof Array) {
      // recurse into the nested arrays
      if (!this[i].equals(arr[i])){
        return false;
	}
    } else if (this[i] != arr[i]) {
      // Warning - two different instances of the object  will never be equal: {x:20} != {x:20}
      return false;
    }
  }
  return true;
}
// hide method from for-in loops
Object.defineProperty(Array.prototype, "equals", {
  enumerable: false
});
The JSON.stringify() method

One of the methods is converting both strings to JSON string and compare the strings to each other to determine equality. The JSON.stringify() method is used to convert the array to a string:

var firstArr = [1, 2, [3, 4, 5]];
var secondArr = [1, 2, [3, 4, 5]];

var isEqual = JSON.stringify(firstArr) === JSON.stringify(secondArr);
console.log(isEqual);

Output:

true

If the array contains null and undefined, the given solution won’t work.

The toString() Method

You can also invoke toString() for camparing an array of numbers and string:

var firstArr = [1, 2, 3, 4, 5];
var secondArr = [1, 2, 3, 4, 5];

var isEqual = firstArr.toString() === secondArr.toString();
console.log(isEqual);

Output:

true

The Array.prototype.every() Method

An alternate way of the above solution is Array.prototype.every() to compare each element of the array with the elements of another array:

var firstArr = [1, 2, 3, 4, 5];
var secondArr = [1, 2, 3, 4, 5];

var isEqual = firstArr.length === secondArr.length &&
  firstArr.every((value, index) => value === secondArr[index]);
console.log(isEqual);

Output:

true

Arrays

Arrays are list-like objects, and their elements are properties with names 0, 1, 2 .. etc. They have special properties: length and many functions that manipulate the elements. Neither the length nor the types of the elements are fixed.

The arrays are zero-indexed, meaning that the first element is at index 0, and the index of the last element is equivalent to the value of the length property minus 1.


Do you find this helpful?

Related articles