如何合并来自两个相同长度的不同数组的对象？

Question

I am working in vanilla JavaScript. I have two arrays of the same length. Each of them is containing objects. I need to create one array with objects combined. How?

So, in code, my input is:

const arr1 = [{name: "John"}, {name: "Peter"}];
const arr2 = [{age: 56}, {age: 22}]

Desirable output:

const arr3 = [{name: "John", age: 56}, {name: "Peter", age: 22}]

I saw solution that ES6 offers, and it goes like this:

const object1 = {
  name: 'John'
}
const object2 = {
  age: 56
}
const object3 = {...object1, ...object2 }

That works just great! I would like to implement this same solution in this example whit objects in arrays using this spread operator. How? :)

Thank you.

Answer 1

Using Array.prototype.map() and spread syntax:

 const arr1 = [{ name: 'John' }, { name: 'Peter' }]; const arr2 = [{ age: 56 }, { age: 22 }]; const arr3 = arr1.map((v, i) => ({ ...v, ...arr2[i] })); console.log(arr3);

Answer 2

Another option

 const arr1 = [{name: "John"}, {name: "Peter"}]; const arr2 = [{age: 56}, {age: 22}]; const result = []; for(let i = 0; i < arr1.length; i++) result.push(Object.assign(arr1[i], arr2[i])); console.log(result)

PS, also as @charlietfl mentioned: if you don't want to mutate objects in arr1 start with empty object ... Object.assign({},arr1[i], arr2[i])