How to combine two json array in Angular?

Question

I have two json arrays with the same length.

e.g

First:

[
  0: {name: "name1", id:"1"},
  1: {name: "name2", id:"2"},
  2: {name: "name3", id:"3"},
]

Second:

[
  0: {surname: "surname1"},
  1: {surname: "surname2"},
  2: {surname: "surname3"},
]

Expected resoult

[
  0: {name: "name1", id:"1", surname: "surname1"},
  1: {name: "name2", id:"2", surname: "surname2"},
  2: {name: "name3", id:"3", surname: "surname3"},
]

How to get this result?

Answer 1

Use map function to iterate over the first one and getting appropriate index you can get surname from the second array and concat them

const arr1 = [
  { name: "name1", id:"1" },
  { name: "name2", id:"2" },
  { name: "name3", id:"3" }
];
  
const arr2 = [
  { surname: "surname1" },
  { surname: "surname2" },
  { surname: "surname3" }
];
  
const newArr = arr1.map((item, index) => ({ ...item, surname: arr2[index].surname}));

console.log(newArr);

Answer 2

You can use Lodash library merge function:

var merge = _.merge(arr1, arr2);