Как объединить два массива, как в этом примере, в Javascript?

Я оказался довольно простым, вам просто нужно немного расширить цикл for:

array_foo=['a','b','c'];
array_bar=['1','2','3','4','5','6','7','8','9','10','11','12'];


for (let i = 4,j=0; i<array_bar.length; i+=4,j++) {
  array_bar.splice(i+j, 0, array_foo[j]);
}

array_bar = array_bar.join();

console.info(array_bar);

Краткое объяснение цикла:

Вместо одного индекса вы отслеживаете два: i для array_bar и j для array_foo. Вы каждый раз увеличиваете i на 4, а i на единицу, так как вы хотите, чтобы они располагались следующим образом (4: 1).

for (let i = 4,j=0; i<array_bar.length; i+=4,j++)

splice позволяет вам вставить элемент в заданную позицию, здесь мы вставляем элемент в i+j, который является 4+0, 8+1 и 12+2, то есть всегда 4 элемента от array_bar.

array_bar.splice(i+j, 0, array_foo[j]);

Если шаблон указан в 4 array_bar 1 из array_foo. Затем я бы сделал небольшой цикл, который выполнит это.

Это петли на основе array_bar

Надеюсь, это поможет:>

var array_foo=['a','b','c'];
var array_bar=['1','2','3','4','5','6','7','8','9','10','11','12'];
var array_new = [];

array_bar.forEach((el,i)=>{
  if ((i)%4==0 && i!=0)
    array_new.push(array_foo[(i/4)-1])
  array_new.push(el);
})
array_new.push(array_foo[array_foo.length-1]);

console.info(array_new)

Использование .forEach()

Вы можете выполнить цикл по массиву foo и для каждого элемента объединить 4-элементный фрагмент bar с текущим элементом foo, а затем объединить результат с res, содержащим все предыдущие фрагменты.

foo = ['a','b','c'];
bar = ['1','2','3','4','5','6','7','8','9','10','11','12'];

res = [];
foo.forEach((e,i) => { res = res.concat(bar.slice(4*i,4*i+4)).concat(e) } );

console.info(res)

Использование .map()

Мы можем добиться того же результата, используя вместо этого .map:

[].concat.apply([], foo.map((e,i) => bar.slice(4*i,4*i+4).concat(e)))

Итак, я отображаю foo следующим образом:

foo[i] <- [bar[4*i], bar[4*i+1], bar[4*i+2], bar[4*i+3], foo[i]] (pseudocode!)

Затем я объединяю все массивы в один: с [].concat.apply([], arrayOfArrays)

foo = ['a','b','c'];
bar = ['1','2','3','4','5','6','7','8','9','10','11','12'];

res = [].concat.apply([], foo.map((e,i) => bar.slice(4*i,4*i+4).concat(e)));

console.info(res)

Без использования .concat

Метод .concat (использованный в двух предыдущих версиях) создает новый массив. Если вы ищете другое решение, все еще использующее .map, вот оно:

foo.map((e,i) => res.push(...bar.slice(i*4, i*4+4), foo[i]));

Вместо того, чтобы объединять массивы, мы вставляем фрагмент элементов bar с элементом foo для каждого элемента foo. Я также использую синтаксис деструктурирующее задание, чтобы развернуть кусок в аргументы, переданные в .push.

foo = ['a','b','c'];
bar = ['1','2','3','4','5','6','7','8','9','10','11','12'];

res = [];
foo.map((e,i) => res.push(...bar.slice(i*4, i*4+4), foo[i]));

console.info(res)