如何按索引合并数组中的每个对象? [英] How to merge each object within arrays by index?

查看:20
本文介绍了如何按索引合并数组中的每个对象?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何合并两个长度相同的对象数组?

var array1 = [{name: "lang", value: "English"},{名称:年龄",值:18"}];var array2 = [{code: "EN", text: "English language"},{代码:DE",值:德语",文本:德语"}];

目标是创建以下数组:

var array3 = [{name: "lang", value: "English", code: "EN", text: "English language"},{名称:年龄",代码:DE",值:德语",文字:德语"}];

这个想法是创建一个新数组,其中 array1 是基,array2 覆盖共享相同键的值,否则添加到基数组.合并应该按照对象出现在每个数组中的相同顺序依次发生.

在这个例子中,数组包含两个对象,但对于我的实际情况,我有几十个对象.

这是我一直在尝试做的,但这只会合并第一组对象:

var array3 = Object.assign(array1[0], array2[0]);

如何遍历或映射它?

解决方案

一个简单的map对象传播语法 会做到.Object.也可以使用assign.分配给一个新的空对象以避免改变现有对象.

var array1 = [{ name: "lang", value: "English" },{名称:年龄",值:18"}];var array2 = [{代码:EN",文本:英语语言"},{ 代码:DE",值:德语",文本:德语"}];var array3 = array1.map((obj, index) => ({...目标,...array2[索引]}));var array3Alternative = array1.map((obj, index) => Object.assign({}, obj, array2[index]));console.log(array3);

请注意,传播模式的顺序和 Object.assign 的参数很重要:后面的属性会覆盖前面的属性.

您还可以添加更多属性,例如默认属性:Object.assign({ code: "XX", value: "Default" }, obj, array2[index])({ code: "XX",值:默认",...obj,...array2[index] }).

如果你想对array1中的对象进行变异,以便将array2中的属性添加到array1中>,只需从 Object.assign({}, obj, array2[index]) 中删除 {},.如果您不希望创建像 array3 这样的结果变量,那么也建议将 map 更改为 forEach.>

如果您有未知数量的数组,如下所示:

const arrays = [数组1,阵列2,阵列3,//...];

那么你可以使用这种方法:

const mergeArray = Array.from({长度:数组[0].length}, (_, index) =>Object.assign({}, ...arrays.map(({[index]: obj}) => obj))));

看看下面的例子:

const arrays = [[{ a: 3, b: 5 },{ a: 7, b: 2 },{一个:1}],[{ b: 8, c: 42 },{ a: 1, b: 12, c: 44 },{ b: 0 }],[{ d: 14, e: 15 },{ d: 7 },{一个:10}]];控制台.log(Array.from({长度:数组[0].length}, (_, index) =>Object.assign({}, ...arrays.map(({[index]: obj}) => obj))));

How can I merge two arrays of objects of same length?

var array1 = [
  {name: "lang", value: "English"}, 
  {name: "age", value: "18"}
];
var array2 = [
  {code: "EN", text: "English language"}, 
  {code: "DE", value: "German", text: "German language"}
];

The goal is to create the following array:

var array3 = [
  {name: "lang", value: "English", code: "EN", text: "English language"}, 
  {name: "age", code: "DE", value: "German", text: "German language"}
];

The idea is to create a new array in which array1 is the base and array2 overrides the values if they share the same key, and otherwise adds to the base array. The merging should happen sequentially in the same order that the objects appear in each array.

In this example, the arrays contains two objects, but for my actual situation, I have a couple of dozens of objects.

This is what I’ve been trying to do, but this only merges the first set of objects:

var array3 = Object.assign(array1[0], array2[0]);

How can I loop through it or map it?

解决方案

A simple map with object spread syntax will do it. Instead of object spread, Object.assign can also be used. Assign unto a new empty object in order to avoid mutating the existing objects.

var array1 = [
    { name: "lang", value: "English" }, 
    { name: "age", value: "18" }
  ];
var array2 = [
    { code: "EN", text: "English language" }, 
    { code: "DE", value: "German", text: "German language" }
  ];

var array3 = array1.map((obj, index) => ({
    ...obj,
    ...array2[index]
  }));
var array3Alternative = array1.map((obj, index) => Object.assign({}, obj, array2[index]));

console.log(array3);

Note that the order of spread patterns and Object.assign’s arguments matters: latter properties overwrite former properties.

You can also add more properties, e.g. default properties: Object.assign({ code: "XX", value: "Default" }, obj, array2[index]) or ({ code: "XX", value: "Default", ...obj, ...array2[index] }).

If you want to mutate the objects in array1, so that the properties from array2 get added into array1, simply remove the {}, from Object.assign({}, obj, array2[index]). Then it would also be advisable to change the map to a forEach if you’re not expecting to create a resulting variable like array3.

If you have an unknown number of arrays like this:

const arrays = [
    array1,
    array2,
    array3,
    // …
  ];

then you can use this approach:

const mergedArray = Array.from({
  length: arrays[0].length
}, (_, index) => Object.assign({}, ...arrays.map(({[index]: obj}) => obj))));

See this in action with the following example:

const arrays = [
    [
      { a: 3, b: 5 },
      { a: 7, b: 2 },
      { a: 1 }
    ],
    [
      { b: 8, c: 42 },
      { a: 1, b: 12, c: 44 },
      { b: 0 }
    ],
    [
      { d: 14, e: 15 },
      { d: 7 },
      { a: 10 }
    ]
  ];

console.log(Array.from({
  length: arrays[0].length
}, (_, index) => Object.assign({}, ...arrays.map(({[index]: obj}) => obj))));

这篇关于如何按索引合并数组中的每个对象?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆