How to merge two array of object into one array of object based on key?

Question

i'm trying to merge two array of object based on key. two array of object like this,

    let array1 = [
    {
      name: "Deepak",
      age: 20
    },
    {
      name: "John",
      age: 30
    }
    ]

    let array2 = [
    {
      name: "Deepak",
      favGame: "Cricket"
    },
    {
      name: "John",
      favGame: "Football"
    },
    {
      name: "Kailash",
      favGame: "Basketball"
    }
   ]

I found difficulties to merge as expected format. I expecting format like this

   let finalArray = [
    {
        name: "Deepak",
        age: 20,
        favGame: "Cricket"
      },
      {
        name: "John",
        age: 30,
        favGame: "Football"
      },
      {
        name: "Kailash",
        favGame: "Basketball"
      }
    ]

score 2 · Answer 1 · answered Dec 01 '22 at 12:23

let a1 = [ { name: 'Deepak', age: 20 }, { name: 'John', age: 30 } ]
let a2 = [
  { name: 'Deepak', favGame: 'Cricket' },
  { name: 'John', favGame: 'Football' },
  { name: 'Kailash', favGame: 'Basketball' }
]

console.log(Object.values([...a1, ...a2]
  .reduce((a,{name, ...p})=>(a[name]={...a[name]??{},name,...p},a), {})))

score 1 · Accepted Answer · answered Dec 01 '22 at 11:56

Using Array.map() and Array.find() can do it

let array1 = [
    {
      name: "Deepak",
      age: 20
    },
    {
      name: "John",
      age: 30
    }
    ]

let array2 = [
    {
      name: "Deepak",
      favGame: "Cricket"
    },
    {
      name: "John",
      favGame: "Football"
    },
    {
      name: "Kailash",
      favGame: "Basketball"
    }
   ]
   
let result = array2.map(a => {
   let obj = array1.find(i => i.name === a.name)
   if(obj){
    a.age = obj.age
   }
   return a
})
console.log(result)

Amirhossein · Answer 3 · 2022-12-01T12:36:17.217

You can do it like this:

const array1 = [
  {
   name: "Deepak",
   age: 20
  },
  {
   name: "John",
   age: 30
  }
];

const array2 = [
  {
   name: "Deepak",
   favGame: "Cricket"
  },
  {
   name: "John",
   favGame: "Football"
  },
  {
   name: "Kailash",
   favGame: "Basketball"
  }
];

const mergedArray = [...array1, ...array2];
const newArray = [];
mergedArray.forEach((item) => {
  const key = item.name;
  let index = -1;
  newArray.forEach((newArrayItem, _index) => {
    if(newArrayItem.name === key)
    index = _index;
  });
  if(index === -1){
    newArray.push({});
    index = newArray.length - 1;
  }
  newArray[index]["name"] = item.name;
  if(item.age) {
    newArray[index]["age"] = item.age;
  }
  if(item.favGame) {
    newArray[index]["favGame"] = item.favGame;
  }
});
console.log(newArray);

score 0 · Answer 4 · answered Dec 01 '22 at 12:39

You can use Array.reduce() to group the items by name.

This will create an object with a property for each name we can then use Object.values() to return the result as an array.

Since we're using a mapping object, this approach will be efficient for large arrays.

let array1 = [ { name: "Deepak", age: 20 }, { name: "John", age: 30 } ]
let array2 = [ { name: "Deepak", favGame: "Cricket" }, { name: "John", favGame: "Football" }, { name: "Kailash", favGame: "Basketball" } ]
   
const result = Object.values([...array1, ...array2].reduce((acc, { name, ...obj }) => { 
    acc[name] = { ...(acc[name] || {}), name, ...obj };
    return acc;
}, {}));

console.log('Result:', result)

.as-console-wrapper { max-height: 100% !important; }

How to merge two array of object into one array of object based on key?

4 Answers4