merge and display array of object data in table using react js

Question

I need to merge array1 and array2 , display in a table

    array1= [ {id: 1,event:party, oldcity: Singapore}
              {id: 2, event:fest,oldcity:Paris }]
    array2= [ {id: 1,event:party, newcity: bombay}
              {id: 2, event:fest,newcity:madras }]
output of merge array
mergearray= [ {id: 1,event:party,oldcity: Singapore,newcity: bombay}
              {id: 2, event:fest,oldcity:Paris,newcity:madras }]

display mergearray in table
  id    event oldcity   newcity
  1     party singapore  bombay
  2     fest  paris      madras

if i merge the array

 mergearray[{id: 1,event:party, oldcity: Singapore}
            {id: 2, event:fest,oldcity:Paris }
           {id: 1,event:party, newcity: bombay }
          {id: 2, event:fest,newcity:madras }]

but am expecting to be like this

mergearray= [ {id: 1,event:party,oldcity: Singapore,newcity: bombay}
          {id: 2, event:fest,oldcity:Paris,newcity:madras }]

Answer 1

How do you merge the arrays ?

const array1 = [{
  id: 1,
  event: 'party',
  oldcity: 'Singapore'
}, {
  id: 2,
  event: 'fest',
  oldcity: 'Paris'
}];
const array2 = [{
  id: 1,
  event: 'party',
  newcity: 'bombay'
}, {
  id: 2,
  event: 'fest',
  newcity: 'madras'
}];

// I would merge arrays this way
const mergedArray = [...array1, ...array2];

console.log('mergedArray: ', mergedArray);