JSで2つの配列を比較して、同じidの場合に新しい配列を生成したいです

Question

内容

以下の2つの配列からオブジェクトの同じidがある場合、profileというオブジェクトを追加して新たな配列を生成したいです。できればarrays1の各オブジェクトの順番は変えないで対応したいです。

const arrays1 = [{id:1, name:'a'}, {id:2, name:'b'}, {id:3, name:'c'}, {id:4, name:'d'}];
const arrays2 = [{id:3, age: 23}, {id:1, age: 31}];

出力したい内容

[
    {id: 1, name: 'a', profile: { age: 31 } },
    {id: 2, name: 'b'},
    {id: 3, name: 'c', profile: { age: 23 } },
    {id: 4, name: 'd'}
]

試したこと

以下のようにmapで試しましたが、当然ながらidの値が重複したオブジェクトが生成されます。これを一意且つ、profileというkeyがある場合はそのオブジェクトを優先して出力したいです。

const resluts = arrays1.flatMap((array1) => {
  return arrays2.map((array2) => {
    if (array1.id !== array2.id) return array1;

    return {
      ...array1,
      profile: {
        age: array2.age,
      },
    };

  });
});

[
  { id: 1, name: 'a' },
  { id: 1, name: 'a', profile: { age: 31 } },
  { id: 2, name: 'b' },
  { id: 2, name: 'b' },
  { id: 3, name: 'c', profile: { age: 23 } },
  { id: 3, name: 'c' },
  { id: 4, name: 'd' },
  { id: 4, name: 'd' }
]

Answer 1

mapはarrays1にだけ使用し、arrays2は検索で回した方が簡単に作成できる気がします。

const results = arrays1.map(array1 => {
    const array2 = arrays2.find((e) => e.id === array1.id)
    if(array2){
        delete array2.id;
        array1.profile = array2;
    }
    return array1;
})

Comments

[yuuyu]

ちなみに上記コードの場合、引数となったオブジェクトを直接操作しているため、arrays1及びarrays2のオブジェクトは変更されます。もし変更を避けたい場合は、Object.assign()等を使用してコピーを扱う必要があります。

[t0909]

ありがとうございます！素早く回答いただけて大変嬉しいです。