Node - Merge dynamic amount of arrays together - alternate the items in the result array

I have a bunch of arrays of different length holding objects of the same types. What I want is to merge all these arrays into one final array. The issue I have is that the items need to alternate in the final result array.

so if for example one array only holds one value to altenate the results until there is no element in the shortest length array and continue with just the others still holding values.

const arr1 = [arr1Obj, arr1Obj, arr1Obj]
const arr2 = [arr2Obj, arr2Obj, arr2Obj]
const arr3 = [arr3obj]

//no pre-defined amount of arrays, could be only one array or 10+

//output desired
[arr1Obj, arr2Obj, arr3Obj, arr1Obj, arr2Obj, arr1Obj, arr2Obj]

My approach was just using a bunch of nested for-loops which I am sure is not the best way of doing this. I am wondering, how would the shortest most performant es6 way look alike? Prefferable without using modules like lodash.

Solution 1:

We can use Array.from() and Array.reduce() to get the sequence we wish for.

We start by getting the max array length using Math.max(), then we use Array.from() to create our output array, using Array.reduce() to append each element as we iterate over the arrays, flattening at the end:

const arr1 = ['arr1Obj', 'arr1Obj', 'arr1Obj']
const arr2 = ['arr2Obj', 'arr2Obj', 'arr2Obj']
const arr3 = ['arr3Obj']

// Sort our input by length, we want the longest array first...
const arrays = [arr1, arr2, arr3]; 

const maxLength = Math.max(...arrays.map(a => a.length));

const result = Array.from({ length: maxLength }, (v, idx) => arrays.reduce((acc, arr) => {
    if (idx < arr.length) {
        acc.push(arr[idx]);
    }
    return acc;
}, [])).flat();

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }