合并两个数组，使值交替

Question

我正在寻找一种 jQuery 方法来合并两个数组，以便它们的值交替：

var array1 = [1,2,3,4,5];
var array2 = ['a', 'b', 'c', 'd', 'e'];

我想要的结果是：

var arrayCombined = [1, 'a', 2, 'b', 3, 'c', 4, 'd', 5, 'e'];

请注意，我知道在 JS 中执行此操作很简单，但是我正在使用可以执行此操作的 jQuery 方法。

Answer 1

你可以使用map方法：

var array1 = [1, 2, 3, 4, 5];
var array2 = ['a', 'b', 'c', 'd', 'e'];

var arrayCombined = $.map(array1, function(v, i) {
  return [v, array2[i]];
});

console.log(arrayCombined);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

演示：http://jsfiddle.net/Guffa/hmUy6/

Answer 2

如果你必须使用 jQuery，你可以利用他们损坏的 $.map 实现。

var result = $.map(array1, function(v, i) {
                                return [v, array2[i]];
                           });

jQuery 的$.map 将返回的数组展平，给你想要的结果。

演示： http://jsfiddle.net/8rn2w/

---

纯JS解决方案：

var result = array1.reduce(function(arr, v, i) {
                              return arr.concat(v, array2[i]); 
                           }, []);

演示： http://jsfiddle.net/8rn2w/1/

Answer 3

使用Array.prototype.flat() 和Array.prototype.map() 的另一种解决方案。

var array1 = [1, 2, 3, 4, 5];
var array2 = ['a', 'b', 'c', 'd', 'e'];

var result = array1.map(
  (element, index) => [element, array2[index]]
).flat();

console.log(result);

Answer 4

试试这样的：

function merge(array1, array2) {
  if (array1.length == array2.length) {
    var c = [];
    for (var i = 0; i < array1.length; i++) {
      c.push([array1[i], array2[i]]);
    }
    return c;
  }
  return null;
}

Answer 5

对于那些通过搜索引擎到达这里并想要 Lodash 选项的人：

_.compact(_.flatten(_.zip(array1, array2)))

Answer 6

我很想知道是否有 new Array.prototype.<whatever>() 对此有帮助 - flatMap 是这样的......有点 - 但我要离开最简单，最明显的解决方案...
（以及 10 年来没有其他人使用 for 循环构建单个数组的一些眼泪）

普通的旧 JavaScript

如果您要合并立体声通道或模板字符串等内容，这就是您所需要的：

// Supports the two most common cases:
//   - interleaving left and right audio channels
//   - interleaving template string and values
// (right is assumed to be the same length as left, or one shorter)
function interleave(left, right) {

  var both = [];
  var i;

  for (i = 0; i < left.length; i += 1) {
    both.push(left[i]);

    // because a template string will have one fewer value
    // than it will have string parts
    if (i < right.length) {
      both.push(right[i]);
    }
  }

  return both;
}

// a template string will always have one extra item
var abc = ['a', 'b', 'c', 'd' ];
var one = [1, 2, 3 ];

var both = interleave(abc, one);
console.log(both);
// ['a', 1, 'b', 2, 'c', 3, 'd']

平面地图

正如评论中提到的，这可能是合适的：

function cleverInterleave() {
  return abc.flatMap(function (val, i) {
    if (one[i]) {
      return [val, one[i]];
    }
    return [val];
  });
}

var abc = ['a', 'b', 'c', 'd' ];
var one = [1, 2, 3 ];

cleverInterleave(abc, one);
// ['a', 1, 'b', 2, 'c', 3, 'd']

然而，这似乎有点过于“聪明”，而且不像 直观。效率也不高……但对于大多数代码来说，可读性远比效率重要，所以……有两个打击。

mo' 频道，mo' 问题

您还可以创建一个更通用的形式来处理任意数量的数组，或者压缩长度不均匀的数组。

但是，我建议使用类似的模式，但要根据您需要的实际阵列数量进行调整 - 例如 3 个用于 RGB，或 4 个用于 RGBA，等等。