javascript - Merge value from one array of JSON into corresponding JSON of another array based on key

Question

I have two arrays of JSON objects. One with contractor details and another with projects. Both have a common field user_id.

I want a resultant array of objects such that each contractor also has an array of his active projects. Example:

arr1 = [{
    name: 'Contractor A',
    user_id: 3,
    mobile_number: '9999999999',
    active_projects: []
},
{
    name: 'Contractor B',
    user_id: 6,
    mobile_number: '9999999999',
    active_projects: []
}]

arr2 = [{
    user_id: 3, project_name: 'Project A'
},
{
    user_id: 3, project_name: 'Project B'
},
{
    user_id: 6, project_name: 'Project C'
}]

The final array should be:

arr1 = [{
    name: 'Contractor A',
    user_id: 3,
    mobile_number: '9999999999',
    active_projects: ['Project A', 'Project B']
},
{
    name: 'Contractor B',
    user_id: 6,
    mobile_number: '9999999999',
    active_projects: ['Project C']
}]

What is the best/cleanest way to achieve this?

Answer 1

You can iterate arr2 using forEach & inside callback use findIndex to find the index of object from arr1 whose user_id matches with the user_id of the object under iteration. Then use the index to populate the value in the first array

let arr1 = [{
    name: 'Contractor A',
    user_id: 3,
    mobile_number: '9999999999',
    active_projects: []
  },
  {
    name: 'Contractor B',
    user_id: 6,
    mobile_number: '9999999999',
    active_projects: []
  }
]

let arr2 = [{
    user_id: 3,
    project_name: 'Project A'
  },
  {
    user_id: 3,
    project_name: 'Project B'
  },
  {
    user_id: 6,
    project_name: 'Project C'
  }
];

arr2.forEach((item) => {
  const findIndexArr1 = arr1.findIndex(elem => elem.user_id === item.user_id);
  if (findIndexArr1 !== -1) {
    arr1[findIndexArr1].active_projects.push(item.project_name)
  }
});
console.log(arr1)