How to Get the Difference Between Two Arrays in JavaScript ?

The problem is to find the difference between two arrays in JavaScript. The objective is to identify the elements that exist in one array but not in the other and return them as a new array.

To get the difference between two arrays in JavaScript, you can use various approaches, some common approaches to achieve differences between two arrays are:

• Using the filter() and includes() methods
• Using for Loop and indexOf() Method
• Using Set and filter() Method
• Using reduce() and includes() Methods

Approach 1: Using the filter() and includes() methods

In this approach, we use the filter() method on the first array and check if each item is not present in the second array using the includes() method. The resulting array contains the elements that are present in the first array but not in the second array.

Syntax:

array1.filter((element) => !array2.includes(element));

Example: In this example, we are using the above-explained approach.

Output:

[1, 2]

Approach 2: Using for Loop and indexOf() Method

To find the difference between two arrays in JavaScript, you can iterate over one array using a for loop and check if each element exists in the other array using the indexOf() method. If an element is not found, it is added to the result array.

Syntax:

function arrayDiff(a, b) {
    let difference = [];
    for (let i = 0; i < a.length; i++) {
        if (b.indexOf(a[i]) === -1) {
            difference.push(a[i]);
        }
    }
    return difference;
};

Example: In this example, we define a function called arrayDifference that takes in two arrays as parameters. We initialize an empty array called difference to store the elements that are present in arr1 but not in arr2. We then use a for loop to iterate over each element in arr1. For each element, we use the indexOf() method to check if it exists in arr2. If the indexOf() returns -1, indicating that the element is not found in arr2, we push it into the difference array.

Output: Finally, we return the difference array, which contains the elements that are present in arr1 but not in arr2.

[1, 2, 0]

Approach 3: Using Set and filter() Method

In this approach, the arrays are converted to Sets using the Set constructor. The Set data structure only allows unique values. By filtering out the elements from the first set that also exist in the second Set, we can obtain the difference.

Syntax:

const difference = [...set1].filter((element) => !set2.has(element));

Example: In this example, we are using the above-explained approach.

Output:

[1, 2]

Approach 4: Using reduce() and includes() Methods

This method iterates over the first array and checks if each element is present in the second array using the includes() method. It accumulates the elements that are not found in the second array, resulting in the difference between the two arrays.

Syntax:

const difference = array1.reduce((result, element) => {
    if (array2.indexOf(element) === -1) {
        result.push(element);
    }
    return result;
}, []);

Example: In this example, we are using the above-explained approach.

Output:

[1, 2]