Merge 2 JS Arrays of Objects by value

Question

Problem

I have two Javascript arrays of objects I need to merge. I need to merge by matching the unique values of a single key:value pair that are contained in each array. The keys for the values I want to merge based on are different

I want to add the key: value pairs from Array 2 to the correct object in Array 1 based on the matching unique value. The values for array1.user and array2._id are the values that I need to match by.

Arrays

const array1 = [ { _id: 5c6c7132f9bf4bdab9c906ff,
    user: 5c65d9438e4a834c8e85dd7d },
  { _id: 5c6ccd6d3a0dc4e4951c2bee,
    user: 5c65d9438e4a834c8e85dd7e } ]

const array2 = users [ { _id: 5c65d9438e4a834c8e85dd7d,
    info: { name: 'John', city: 'New York' } },
  { _id: 5c65d9438e4a834c8e85dd7e,
    info: { name: 'Paneer', city: 'San Fran' } } ]

What I've tried

I've tried using lodash's _.map and _.extend function like so but I'm new to lodash and it's not giving me the proper output

  const mergedArray = _.map(array1, function(item){
    return _.extend(item, _.find(array2, {_id: item.user}));
  });

Result

mergedArray [ { _id: 5c65d9438e4a834c8e85dd7d,
    info: { name: 'John', city: 'New York' } },
  { _id: 5c65d9438e4a834c8e85dd7e,
    info: { name: 'Paneer', city: 'San Fran' } }]

Desired Result

const mergedArray = [ { _id: 5c6c7132f9bf4bdab9c906ff,
    user: 5c65d9438e4a834c8e85dd7d,
    info: { name: 'John', city: 'New York' } } ,
  { _id: 5c6ccd6d3a0dc4e4951c2bee,
    user: 5c65d9438e4a834c8e85dd7e, 
    info: { name: 'Paneer', city: 'San Fran' } } ]

Why are they arrays? Is there a required sorting order? If not, you seem to have unique IDs, which makes the structure much more handy as an object where the _id is the key. Then you can easily look up by ID, and avoid all that iteration. — ziggy wiggy
– ziggy wiggy, Commented Apr 13, 2019 at 15:40
Possible duplicate of Merge two unordered objects with different keys but same value? — Heretic Monkey
– Heretic Monkey, Commented Apr 13, 2019 at 15:55

Code Maniac · Accepted Answer · 2019-04-13 15:31:31Z

1

You can use map and find

In case your mapping of arrays are in same sequence than you can avoid use of find

const array1 = [ { _id: `5c6c7132f9bf4bdab9c906ff`,user: `5c65d9438e4a834c8e85dd7d` },{ _id: `5c6ccd6d3a0dc4e4951c2bee`,user: `5c65d9438e4a834c8e85dd7e` }]
const array2 =[ { _id: `5c65d9438e4a834c8e85dd7d`,info: { name: 'John', city: 'New York' } },{ _id: `5c65d9438e4a834c8e85dd7e`,info: { name: 'Paneer', city: 'San Fran' } } ]
    
const final = array1.map(e=> {
  const found = array2.find(({_id}) => e.user === _id)
  return {
    ...e,
    info : found.info
  }
})

console.log(final)

answered Apr 13, 2019 at 15:31

Code Maniac

37.9k5 gold badges44 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

bzlight Over a year ago

The two arrays I need to merge are actually being returned from MongoDB and for some reason any method I've tried doesn't work, even though the same method works perfectly for a javascript array. Do you have any suggestions how to apply this solution to arrays returned from MongoDB? I'm using Mongoose if that makes a difference.

Nina Scholz · Accepted Answer · 2019-04-13 15:35:28Z

0

You could take a Map and build new object for the result.

const
    array1 = [{ _id: '5c6c7132f9bf4bdab9c906ff', user: '5c65d9438e4a834c8e85dd7d' }, { _id: '5c6ccd6d3a0dc4e4951c2bee', user: '5c65d9438e4a834c8e85dd7e' }],
    array2 = [{ _id: '5c65d9438e4a834c8e85dd7d', info: { name: 'John', city: 'New York' } }, { _id: '5c65d9438e4a834c8e85dd7e', info: { name: 'Paneer', city: 'San Fran' } }],
    users = new Map(array2.map(({ _id, info }) => [_id, { info }])),
    merged = array1.map(o => ({ ...o, ...(users.get(o.user) || {}) }));

console.log(merged);

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

answered Apr 13, 2019 at 15:35

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

1 Comment

bzlight Over a year ago

The two arrays I need to merge are actually being returned from MongoDB and for some reason any method I've tried doesn't work, even though the same method works perfectly for a javascript array. Do you have any suggestions how to apply this solution to arrays returned from MongoDB? I'm using Mongoose if that makes a difference.

Ele · Accepted Answer · 2019-04-13 17:21:10Z

0

An alternative is to generate an object with keys, and later get the values directly using that generated object. The key access is very fast.

const array1 = [ { _id: "5c6c7132f9bf4bdab9c906ff",user: "5c65d9438e4a834c8e85dd7d" },{ _id: "5c6ccd6d3a0dc4e4951c2bee",user: "5c65d9438e4a834c8e85dd7e" } ];
const ids = array1.reduce((a, {user, _id}) => ({...a, [user]: _id}), {});
const array2 = [ { _id: "5c65d9438e4a834c8e85dd7d",info: { name:'John', city: 'New York' } },{ _id: "5c65d9438e4a834c8e85dd7e", info: { name: 'Paneer', city: 'San Fran' } } ];
    
array2.forEach(o => {
  o.user = o._id;
  o._id = ids[o._id];
});

console.log(array2);

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

edited Apr 13, 2019 at 17:21

answered Apr 13, 2019 at 15:46

Ele

33.8k7 gold badges43 silver badges80 bronze badges

Collectives™ on Stack Overflow

Merge 2 JS Arrays of Objects by value

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related