合并两个数组的相同索引对象答案

【问题标题】：Combine same-index objects of two arrays合并两个数组的相同索引对象
【发布时间】：2016-03-08 16:39:50
【问题描述】：

假设我有两个对象数组，如下所示：

var arr1 = [{name: 'Jay'}, {name: 'Bob'}];
var arr2 = [{age: 22}, {age: 30}];

我想要一个这样的组合数组：

var arr3 = [{name: 'jay', age: 22}, {name: 'Bob', age: 30}];

您可以放心地假设两个初始数组的索引相互匹配，这意味着 arr1 的索引 0 将始终与 arr2 的索引 0 匹配。

最快的方法是什么？我在想象一个 forEach 循环嵌套在另一个 forEach 循环中，并将每个对象从 arr1 扩展为来自 arr2 的当前对象，但我觉得这可能太复杂了。

【问题讨论】：

标签： javascript arrays object

【解决方案1】：

您可以只迭代一个数组并使用第一次迭代的索引创建一个新数组。有很多方法可以做到这一点。这是一个：

    var arr1 = [{name: 'Jay'}, {name: 'Bob'}];
    var arr2 = [{age: 22}, {age: 30}];

    var combined = arr1.map(function(item, index) {
        return {name: item.name, age: arr2[index].age};
    });
    document.write(JSON.stringify(combined));

如果您真的想要最高性能，您必须在多种不同的浏览器中测试多种方案。例如，有时for 循环比某些浏览器中的内置数组方法更快。

var arr1 = [{name: 'Jay'}, {name: 'Bob'}];
var arr2 = [{age: 22}, {age: 30}];
var combined = [];

for (var i = 0; i < arr1.length; i++) {
  combined[i] = {name: arr1[i].name, age: arr2[i].age};
}

document.write(JSON.stringify(combined));

仅供参考，for 循环选项（第二个选项）在a jsperf 中的所有三个浏览器中看起来都快了很多。

【讨论】：

【解决方案2】：

最简单的解决方案是（与任何 util lib 像 underscore.js 或类似的相比）。它的优点是它可以在没有任何依赖的情况下工作。

var result = [];
for(var i = 0; i < arr1.length; i+= 1) {
  item = {};
  item.name = arr1[i].name;
  item.age = arr2[i].age;
  result.push(item);
}

【讨论】：

【解决方案3】：

在 for 循环中：

var arr1 = [{name: 'Jay'}, {name: 'Bob'}];
var arr2 = [{age: 22}, {age: 30}];


for(var i in arr1)
{
  arr1[i]['age'] = arr2[i]['age'];
}

console.log(arr1) //[Object { name="Jay",  age=22}, Object { name="Bob",  age=30}]

现在您在 arr1 中获得了合并结果。

【讨论】：

【解决方案4】：

更松散耦合的解决方案是使用 lodash 库的 merge 功能。

这将与您在对象中的键数和键名无关。因此，将来如果您决定向对象添加键，则无需更新代码即可合并对象。

var _ = require('lodash');

var arr1 = [{name: 'Jay'}, {name: 'Bob'}];
var arr2 = [{age: 22}, {age: 30}];
var arr3 = [];

for (var i=0; i<arr1.length; i++) {
    arr3.push(_.merge(arr1[i], arr2[i]));
}

console.log(arr3);

【讨论】：