合并两个数组，使值交替

Posted 2023-02-23

【中文标题】合并两个数组，使值交替

【英文标题】：Merge Two Arrays so that the Values Alternate

【发布时间】：2012-10-26 13:44:33

【问题描述】：

我正在寻找一种 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 方法。

【问题讨论】：

没有jquery方法。为什么需要在jquery中完成？！

为什么？正如你所说，用纯 javascript 做是微不足道的。

为什么？它与 DOM 或 jQuery 专门用于的其他东西无关。

是否必须有一个 jQuery 方式来做所有事情？

如果它在 JavaScript 中是微不足道的，请在 JavaScript 中执行。为工作使用正确的工具。

【参考方案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/

【讨论】：

var arrayCombined = array1.map(function(v,i) return [v, array2[i]]; ).reduce(function(a,b) return a.concat(b); ); ES5-vanilla JS

感谢您实际回答了这个问题，而不是在没有 jQuery 的情况下对如何做到这一点大惊小怪。

+1 用于在后面的 jsfiddle 中添加链接，我首先通过 jsfiddle 找到了它

我已经概括了 @jAndy 的代码以支持要合并的数组数组。这是用 ES6 编写的：combined = arraysArray[0].map((v, i) => arraysArray.reduce((a, b) => a.concat(b[i]), [])).reduce((a, b) => a.concat(b), []);。

array of arrays version like @GalTalmor 的：combined = arraysArray.reduce((t, u, v, w) => u.reduce((x, y, z) => (x[z * w.length + v] = y, x), t), []); 很快！ jsben.ch/2ZIGk

【参考方案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/

【讨论】：

已记录，因此不是错误

@JanDvorak：是的，但它仍然是 IMO 故障。

@JanDvorak：你比我亲切得多。:)

【参考方案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);

【讨论】：

注意：Array.prototype.flat() 需要 Node.js 11.0.0 或更高版本。

现在可以通过Array.prototype.flatMap() 一步完成（有不同的支持）

【参考方案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;

【讨论】：

没有抱怨什么的，但这可以很容易地用不同长度的数组来完成。

没有足够的jQuery（啊，我终于有正当理由这么说了）。

是的，这绝对可以做到，但我首先想到的是这个，所以尝试了！！！

要匹配指定的格式，你应该将c.push([array1[i], array2[i]])改为c.push(array1[i], array2[i])。

【参考方案5】：

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

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

【参考方案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，等等。