How to update one array with data from another array in Javascript using Key of Id?

Question

I have two arrays in Javascript, I need to update the first array with the contents of the second array using the key of id.

I need to find the id from the array and update the same object.

since b is an array of a single object, I can use b[0].id

const a = [{id: 1, name: 'test', data: 'yes'}, {id: 2, name: 'test 1'}]

const b = [{id: 1, name: 'sample', data: 'no'}, {id: 3, name: 'sample', data: 'no'}]

const output = [{id: 1, name: 'sample', data: 'no'}, {id: 2, name: 'test 1'}, {id: 3, name: 'sample', data: 'no'}]

Any help will be appreciated

Do you want to update the object in place, or replace the entire object? — Barmar
– Barmar, Commented Apr 8, 2019 at 7:09

Nina Scholz · Accepted Answer · 2019-04-08 08:12:37Z

3

You could take a Map and map new objects with the properties of a and b.

const
    a = [{ id: 1, name: 'test', data: 'yes' }, { id: 2, name: 'test 1' }],
    b = [{ id: 1, name: 'sample', data: 'no' }],
    map = new Map(b.map(o => [o.id, o])),
    result = a.map(o => Object.assign({}, o, map.get(o.id)));

console.log(result);

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

For getting a new array with all items, you could take a closure over the result array and a Map.

const
    merge = (target, map = new Map) => source => {
        var object = {};
        if (!map.has(source.id)) {
            map.set(source.id, object);
            target.push(object);
        }
        Object.assign(map.get(source.id), source);
    },
    a = [{ id: 1, name: 'test', data: 'yes' }, { id: 2, name: 'test 1' }],
    b = [{ id: 1, name: 'sample', data: 'no' }, { id: 3, name: 'sample', data: 'no' }],
    result = [],
    update = merge(result);

[a, b].forEach(a => a.forEach(update));

console.log(result);

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

edited Apr 8, 2019 at 8:12

answered Apr 8, 2019 at 7:14

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

2 Comments

Beginner Over a year ago

if the second array b is having a new id like id: 3, how can i add that one to the result

Beginner Over a year ago

i have updated the question i have another object id as 3 in the b array how can i merge that one to the result

Jack Bashford · Accepted Answer · 2019-04-08 07:20:14Z

2

Use map and some with spreading:

const a = [{id: 1, name: 'test', data: 'yes'}, {id: 2, name: 'test 1'}];
const b = [{id: 1, name: 'sample', data: 'no'}];

const output = a.map(e => b.some(({ id }) => id == e.id) ? ({ ...e, ...b.find(({ id }) => id == e.id)}) : e);

console.log(output);

answered Apr 8, 2019 at 7:20

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

1 Comment

Beginner Over a year ago

i have updated the question i have another object id as 3 in the b array how can i merge that one to the result

Dave · Accepted Answer · 2019-04-08 08:03:11Z

2

I would do something like this:

const a = [{id: 1, name: 'test', data: 'yes'}, {id: 2, name: 'test 1'}];

const b = [{id: 1, name: 'sample', data: 'no'}];

let output = [];

output = a.map((element) => {
    const newEl = b.filter(e => e.id === element.id);
    if (newEl[0] != undefined) {
        return newEl[0];
    } else {
        return element;
    }
});

console.log(output);

UPDATE:

As you updated your question, this could be a possible solution:

const a = [{id: 1, name: 'test', data: 'yes'}, {id: 2, name: 'test 1'}]

const b = [{id: 1, name: 'sample', data: 'no'}, {id: 3, name: 'sample', data: 'no'}]

let output = [];

Array.prototype.unique = function() {
    let a = this.concat();
    for(let i=0; i<a.length; ++i) {
        for(let j=i+1; j<a.length; ++j) {
            if(a[i].id === a[j].id)
                a.splice(j--, 1);
        }
    }
    return a;
};

const mergedArrays = a.concat(b).unique();

output = mergedArrays.map((element) => {
    const newEl = b.filter(e => e.id === element.id);
    if (newEl[0] != undefined) {
        return newEl[0];
    } else {
        return element;
    }
});

console.log(output);

Basically you merge the two starting arrays a and b, using a custom Arrays function called unique that checks for duplicates and remove them a[i].id === a[j].id, based on IDs. Then you proceed as usual doing a map on the new mergedArrays.

edited Apr 8, 2019 at 8:03

answered Apr 8, 2019 at 7:22

Dave

2,2704 gold badges20 silver badges40 bronze badges

1 Comment

Beginner Over a year ago

i have updated the question i have another object id as 3 in the b array how can i merge that one to the result

Collectives™ on Stack Overflow

How to update one array with data from another array in Javascript using Key of Id?

3 Answers 3

2 Comments

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related