Calculate Symmetric Difference Between Two Arrays in JavaScript

The symmetric difference between two arrays consists of the elements that are present in either array but not in both.

• Common elements are excluded from the result.
• Elements unique to either array are included.
• The symmetric difference can be represented as A Δ B = (A - B) ∪ (B - A).
• It can be calculated using loops, array methods, Set, or libraries such as Lodash.

We can get the symmetric difference between two arrays using the following approaches.

Approach 1: Using for Loop

In this approach, we use nested for and while loops to check whether each element of one array exists in the other array. If an element is not found, it is added to the result.

Example: In this example, we find the symmetric difference between two arrays using a for loop.

const array1 = [1, 2, 3, 4, 5, 7, 9];
const array2 = [5, 6, 7, 8, 9];

function symmetricDifference(arr1, arr2) {
    const result = [];

    for (let i = 0; i < arr1.length; i++) {
        let found = false;

        for (let j = 0; j < arr2.length; j++) {
            if (arr1[i] === arr2[j]) {
                found = true;
                break;
            }
        }

        if (!found) {
            result.push(arr1[i]);
        }
    }

    for (let i = 0; i < arr2.length; i++) {
        let found = false;

        for (let j = 0; j < arr1.length; j++) {
            if (arr2[i] === arr1[j]) {
                found = true;
                break;
            }
        }

        if (!found) {
            result.push(arr2[i]);
        }
    }

    return result;
}

console.log(symmetricDifference(array1, array2));

[ 1, 2, 3, 4, 6, 8 ]

Approach 2: Using filter() and includes()

In this approach, we use the filter() method to select elements that are not present in the other array. The includes() method checks whether an element exists in the other array.

Syntax:

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

Example: In this example, we use filter() and includes() to find elements that are unique to each array and combine them.

const array1 = [1, 2, 3, 4, 5, 7, 9];
const array2 = [5, 6, 7, 8, 9];

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

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

const result = [...difference1, ...difference2];

console.log(result);

[ 1, 2, 3, 4, 6, 8 ]

Approach 3: Using Set and filter()

In this approach, we convert both arrays into Set objects. Since a Set stores unique values, it can efficiently check whether an element exists using the has() method.

Syntax:

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

Example: In this example, we use Set and filter() to find the symmetric difference.

const array1 = [1, 2, 3, 4, 5, 7, 9];
const array2 = [5, 6, 7, 8, 9];

const set1 = new Set(array1);
const set2 = new Set(array2);

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

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

const result = [...difference1, ...difference2];

console.log(result);

[ 1, 2, 3, 4, 6, 8 ]

Approach 4: Using reduce() and includes()

In this approach, we use the reduce() method to iterate over each array and collect elements that are not present in the other array.

Syntax:

const difference = array1.reduce((result, element) => {
    if (!array2.includes(element)) {
        result.push(element);
    }

    return result;
}, []);

Example: In this example, we use reduce() and includes() to calculate the symmetric difference.

const array1 = [1, 2, 3, 4, 5, 7, 9];
const array2 = [5, 6, 7, 8, 9];

const difference1 = array1.reduce((result, element) => {
    if (!array2.includes(element)) {
        result.push(element);
    }

    return result;
}, []);

const difference2 = array2.reduce((result, element) => {
    if (!array1.includes(element)) {
        result.push(element);
    }

    return result;
}, []);

const result = [...difference1, ...difference2];

console.log(result);

[ 1, 2, 3, 4, 6, 8 ]

Approach 5: Using Lodash Library

The Lodash library provides the xor() method to directly calculate the symmetric difference between two arrays.

Example: In this example, we use Lodash's xor() method to return the elements present in either array but not in both.

const _ = require("lodash");

const array1 = [1, 2, 3];
const array2 = [3, 4, 5];

const symmetricDifference = _.xor(array1, array2);

console.log(symmetricDifference);

Output:

[1, 2, 4, 5]