Find Symmetric difference of multi-dimensional and a single-dimensional arrays

Question

I need some help finding symmetric difference of a multi dimensional array, and a simple array. The first value in each inner array of the multidimensional array cells is the index that compares to the simple array.

So

array1 = [1,4,6,7]
array2 = [[1,"more",12],[8,"some",12]]

the result should be something like:

compare(array1, array2) = //[4,6,7] // there are three differences when compared this way
compare(array2, array1) = //[8,"some",12] // there is only one difference when compared this way

I need to return an array that has both difference of array1 from array2 AND difference from array2 from array1 in the same format as the lead array.

Ideally these are not overwriting the existing arrays but creates a new with the output results. There won't be other array formats besides these two array formats. Each compare can use a different function if it helps. You don't have to use the same function for both, but if you can, great.

I tried a few permutations of loop comparisons Also solutions found here How to get the difference between two arrays of objects in JavaScript And of the simple array methods here How to get the difference between two arrays in JavaScript?

But I just am not being successful. Can someone give me a hand, and also explain their solution? Any modern tools are fine as long as its broadly cross browser compatible. All my other code sticks to ES6, so that would be ideal. If whipping out a one liner solution please explain what is going on so I can learn.

Thanks!

Update @ Dave, this made sense to me, but after it failed I started trying different filter methods and other techniques in the posts above, without much success.

let newNurkles = new Array();
        for(var i = 0; i < nurkles.length; i++){
            if(this.activeNurkles.includes(nurkles[i])){
            } else {
                newNurkles.push(nurkles[i]);// if not then push to array
            }
        }
        console.warn("Nurkles to Add" + newNurkles);

Answer 1

This shows how to perform a disjunctive union on two arrays, one being single dimensional while the other is a multidimensional array.

The symmetry is determined by each element of the single with the first element of each sub-array in the multi. The multi will only be one level deep.

Uses: Array.prototype.map(), Array.prototype.filter()

Steps:

1. Map over the first input array
2. For each element, filter the second input to exclude those found in first input
3. Limit results to only the first array returned

Notes:

• o is the iteration of array1
• t is iteration of array2
• t[0] represents the match key
• t[idx] represents the current value of the sub-array being iterated
• Results from array2 will produce a multidimensional array

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

const oneToTwo = array2.map((t, idx) => array1.filter(o => t[idx] !== o))[0]

const twoToOne  = array1.map(o => array2.filter(t => o !== t[0]))[0]

console.log(oneToTwo);
console.log(twoToOne)