Lodash - How to merge two arrays of objects based on key?

Question

I'm trying to concat two arrays of objects with lodash. I have these two array and I use concat operator in this way:

 var array1 = [{ id: 1, name: 'doc1' }, { id: 2, name: 'doc2' }];
 var array2 = [{id:1, name:'doc1'}, {id:3, name:'doc3'}, {id:4, name:'doc4'}];

 var array3 = _.concat(array1, array2);

I would like an array like this

 [{id:1, name:'doc1'}, {id:2, name:'doc2'}, {id:3, name:'doc3'}, {id:4, name:'doc4'}]]

But with concat function I obtain an array like this:

  [{ id: 1, name: 'doc1' }, { id: 1, name: 'doc1' }, { id: 2, name: 'doc2' }, { id: 3, name: 'doc3' }, { id: 4, name: 'doc4' }]]

I want to avoid the repetition of an object with the same id...Which kind of operator can I use?

Derek Wang · Accepted Answer · 2020-10-28 10:52:10Z

11

You can get the result using merge and keyBy lodash functions.

var array1 = [{id:1, name:'doc1'}, {id:2, name:'doc2'}];
var array2 = [{id:1, name:'doc1'}, {id:3, name:'doc3'}, {id:4, name:'doc4'}];

var merged = _.merge(_.keyBy(array1, 'id'), _.keyBy(array2, 'id'));
var values = _.values(merged);
console.log(values);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

answered Oct 28, 2020 at 10:52

Derek Wang

10.2k4 gold badges20 silver badges40 bronze badges

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

Comments

danronmoon · Accepted Answer · 2022-06-02 19:55:35Z

2

Use _.unionBy() to combine two arrays, and remove duplicates that have the same unique field (id in this case). The lodash's union methods create an array of unique values. The _.unionBy() method accepts an iteratee which is invoked for each element of each array to generate the criterion by which uniqueness is computed.

const array1 = [{id:1, name:'doc1'}, {id:2, name:'doc2'}];
const array2 = [{id:1, name:'doc1'}, {id:3, name:'doc3'}, {id:4, name:'doc4'}];

const result = _.unionBy(array1, array2, 'id');
console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

edited Jun 2, 2022 at 19:55

danronmoon

3,8735 gold badges36 silver badges58 bronze badges

answered Oct 28, 2020 at 10:54

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

Comments

danronmoon · Accepted Answer · 2022-06-02 19:55:48Z

1

You have uniqWith in lodash that allows you to do this: https://lodash.com/docs#uniqWith

var array1 = [{id:1, name:'doc1'}, {id:2, name:'doc2'}];
var array2 = [{id:1, name:'doc1'}, {id:3, name:'doc3'}, {id:4, name:'doc4'}];

var values = _.uniqWith([...array1, ...array2], _.isEqual);
console.log(values);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>

edited Jun 2, 2022 at 19:55

danronmoon

3,8735 gold badges36 silver badges58 bronze badges

answered Oct 28, 2020 at 10:57

Quentin Fonck

1,3139 silver badges14 bronze badges

Collectives™ on Stack Overflow

Lodash - How to merge two arrays of objects based on key?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related