Merge arrays of objects manteining all the properties

Question

I have 2 array of objects and I want to merge them.

var fruits = [
    {name: 'pear', cultivar: '', color: 'yellowgreen', size: '6'},
    {name: 'apple', cultivar: 'Annurca', color: 'red', size: '5'},
    {name: 'apple', cultivar: 'fuji', color: 'red', size: '4'}
]; 

var quantity = [
    {name: 'pear', number: '15'},
    {name: 'apple', number: '50', scad: '2018'},
    {name: 'apple', number: '50'}
];

What I want is:

var all = [
    {name: 'pear', cultivar: '', color: 'yellowgreen', size: '6', number: '15', scad: 'NaN'},
    {name: 'apple', cultivar: 'Annurca', color: 'red', size: '5', number: '50', scad: '2018'},
    {name: 'apple', cultivar: 'fuji', color: 'red', size: '4', number: '50', scad: 'NaN'}
];

Each element is complete with all the properties: name, cultivar, color, size, number and scad (which is NaN if the property doesn't exist).

Possible duplicate of [Merging objects (associative arrays)](https://stackoverflow.com/questions/929776/merging-objects-associative-arrays) — mcbrent, Jun 02 '18 at 03:49
Loop over one of them and call push on the other array for every object you encounter. — dodexahedron, Jun 02 '18 at 03:50

score 2 · Accepted Answer · answered Jun 02 '18 at 03:50

Just .map the arrays together:

var fruits = [
    {name: 'pear', cultivar: '', color: 'yellowgreen', size: '6'},
    {name: 'apple', cultivar: 'Annurca', color: 'red', size: '5'},
    {name: 'apple', cultivar: 'fuji', color: 'red', size: '4'}
]; 

var quantity = [
    {name: 'pear', number: '15'},
    {name: 'apple', number: '50', scad: '2018'},
    {name: 'apple', number: '50'}
];

const all = fruits.map((fruit, i) => (
  { ...fruit, scad: NaN, ...quantity[i] }
));
console.log(all);

Merge arrays of objects manteining all the properties

1 Answers1