How to get the difference between two arrays in JavaScript?

ByAnas Kiani

Introduction

As we all know arrays are an essential part of javascript. In this article, we will discuss how to get the difference between two arrays in Javascript. In arrays, we can store different values such as numbers, strings, undefined, null, boolean, arrays, objects, and functions.

Methods

  • Array.filter() Method
  • For Loop Method

1) Array.filter() Method

It is the most common & simplest method used in javascript arrays. This method has a callback function in which a specific condition or test is defined. Each element that passes the condition is added to a new array. Using the array, let’s see how to get the difference between two arrays in javascript.filter() method:

function getArrayDifference(arr1, arr2) {
  return arr1.filter(element => !arr2.includes(element));
}
const arr1 = [11, 10, 13, 14, 15];
const arr2 = [13, 14, 15, 19, 18];
const difference = getArrayDifference(arr1, arr2);
console.log(difference); // Output: [11, 10, 19, 18]
Code Explanation:

In the above code, a function “getArrayDifference” is defined that takes two arguments “arr1” & “arr2”. In return, the filter method is applied on “arr1” which iterates through each array element. In the filter method, the callback function is defined which checks that the current element is present in the “arr2” using the includes method. If the callback function returns true the value is added to the new array else it is not included in the new array.

Hence the constant variable “difference” contains the difference between both “arr1” & “arr2”. In the last step, the difference is displayed in the console.

2) For Loop Method

For Loop is the beginner-friendly method used to get the difference between two arrays in JavaScript. In this method, we will use for loop with a conditional statement such as an if statement. Using the for loop method, let’s see how to get the difference between two arrays in javascript:

function getArrayDifference(arr1, arr2) {
  const difference = [];
  for (let i = 0; i < arr1.length; i++) {
    if (!arr2.includes(arr1[i])) {
      difference.push(arr1[i]);
    }
  }
  return difference;
}
// Example usage:
const arr1 = [1, 2, 3, 4, 5];
const arr2 = [3, 4, 5, 6, 7];
const difference = getArrayDifference(arr1, arr2);
console.log(difference); // Output: [1, 2, 6, 7]
Code Explanation:

In the first step, a getArrayDifference function takes two parameters “arr1” & “arr2”. After that, a const variable difference is defined to store the difference between both arrays. In the next step, for loop is applied that iterates through each array element. Inside the for loop conditional statement “if” is used which checks that the current element of arr1 is present in the arr2 if present then the element is pushed to the difference array. In the last step, the function returns the difference array.

Conclusion

Throughout this article, we have examined two different approaches which can be used to get the difference between two arrays in JavaScript. Both methods are simple but the array.filter method is quite short so maybe some people prefer it & for loop method is also beginner friendly.

Similar Posts