Javascript - How to mix two arrays of objects with specific sorting order?

Question

I have two array of objects. Something like this:

var arrayA = [
    {
        type: 'card',
        id: 1
    },
    {
        type: 'card',
        id: 2
    },
    {
        type: 'card',
        id: 3
    },
    {
        type: 'card',
        id: 4
    },
    {
        type: 'card',
        id: 5
    },
];

var arrayB = [
    {
        type: 'pro-tip',
        id: 10
    },
    {
        type: 'pro-tip',
        id: 11
    },
];

I want to merge these two arrays of objects, but on a specific order. Basically, what I want is that, after each N number of elements from arrayA, I want to add one element from arrayB. If N == 2 The final array would look like this:

var finalArray = [
    {
        type: 'card',
        id: 1
    },
    {
        type: 'card',
        id: 2
    },
    {
        type: 'pro-tip',
        id: 10
    },
    {
        type: 'card',
        id: 3
    },
    {
        type: 'card',
        id: 4
    },
    {
        type: 'pro-tip',
        id: 11
    },
    {
        type: 'card',
        id: 5
    },
];

Probably it is not difficult to do something like this, but I'm looking for the most elegant way to build a helper function to do that.

Edit:

Here's the function I created. It seems like it works, but there might be a simpler way to do it:

function mergeWithSteps( arrayA, arrayB, nSteps, nElementsToAdd ) {
    var finalArray = [],
        stepsCount = 0,
        elementsToAddCount = 0,
        arrayBNumberOfElements = arrayB.length;

    arrayA.forEach( function( obj ) {
        finalArray.push( obj );
        stepsCount++;

        if( stepsCount == nSteps && elementsToAddCount < arrayBNumberOfElements ) {
            finalArray.push( arrayB[ elementsToAddCount ] );
            elementsToAddCount++;
            stepsCount = 0;
        }
    } );

        return finalArray;
}

please add some not so elegant code to the question, you tried. — Nina Scholz
– Nina Scholz, Commented Jul 13, 2018 at 17:06
you should first look up how to merge two arrays then look up how to sort an array based off a specific object attribute — dave
– dave, Commented Jul 13, 2018 at 17:08
Hi @NinaScholz sorry, forgot to provide an example. Just added the function I have so far. — Diego de Oliveira
– Diego de Oliveira, Commented Jul 13, 2018 at 17:22

Nina Scholz · Accepted Answer · 2018-07-13 17:13:16Z

3

You could use Array#slice for inserting the wanted item and iterate arrayB from the end, because every splicing changes the indices after the insertation index.

var arrayA = [{ type: 'card', id: 1 }, { type: 'card', id: 2 }, { type: 'card', id: 3 }, { type: 'card', id: 4 }, { type: 'card', id: 5 }],
    arrayB = [{ type: 'pro-tip', id: 10 }, { type: 'pro-tip', id: 11 }],
    place = 2,
    i = arrayB.length;

while (i) {
    arrayA.splice(i * place, 0, arrayB[--i]);
}

console.log(arrayA);

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

answered Jul 13, 2018 at 17:13

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Diego de Oliveira Over a year ago

Nice! I completely forgot that you can add elements with array.splice as well.

Diego de Oliveira Over a year ago

I think your solution is the best, almost just one line with array.splice. I ended up using this solution, and I plan to make it more flexible in the future. Thanks!

Seva Kalashnikov · Accepted Answer · 2018-07-13 17:23:49Z

0

Here's my iterative solution using for

countA = arrayA.length;
countB = arrayB.length;
merged = [];

for (var i = 0, j = 0, m = 0; i < countA; i ++, m ++) {
    if (i > 0 && i%2 == 0 && typeof arrayB[j] !== 'undefined') {
        merged[m] = arrayB[j];
        j ++;
        m ++;
    }
    merged[m] = arrayA[i];
}
// if you'd like to place all remaining arrayB elements after arrayA is exhausted
if (countB > j) {
    for (i = j; i < countB; i++, m ++) {
        merged[m] = arrayB[i];
    }
}

answered Jul 13, 2018 at 17:23

Seva Kalashnikov

4,4322 gold badges26 silver badges36 bronze badges

Comments

Hikmat G. · Accepted Answer · 2018-07-13 18:19:33Z

0

You can use reduce if the initial array is not to modify.

const arrayA = [
  {
    type: 'card',
    id: 1
  },
  {
    type: 'card',
    id: 2
  },
  {
    type: 'card',
    id: 3
  },
  {
    type: 'card',
    id: 4
  },
  {
    type: 'card',
    id: 5
  },
];

const arrayB = [
  {
    type: 'pro-tip',
    id: 10
  },
  {
    type: 'pro-tip',
    id: 11
  },
];

const res = arrayA.reduce((acc, a, i) => {
  const b = arrayB[(i + 1) / 2 - 1];
  return [...acc, a, ...(b ? [b] : [])];
}, []);

console.log(res);

edited Jul 13, 2018 at 18:19

answered Jul 13, 2018 at 17:57

Hikmat G.

2,6211 gold badge22 silver badges41 bronze badges

Collectives™ on Stack Overflow

Javascript - How to mix two arrays of objects with specific sorting order?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related