javascript - How do I merge two arrays of Objects with a shared ID in TypeScript?

Question

I have two Arrays of Objects, that share an ID. How do I merge them into a single Array, where all items have been merged based on the ID?

I'm using TypeScript and Angular.

const array0 = [
  {
    subject_id: "711",
    topics: [ "Test", "Test2" ]
  },
  {
    subject_id: "712",
   topics: [ "topic1", "Topic2" ]
  }
];

const array1 = [
  {
    subject_id: 711,
    subject_name: "Science"
  },
  {
    subject_id: 712,
    subject_name: "Maths"
  }
];

I want the merged result to be:

const result = [
  {
    subject_id: "711",
    subjectName: "Science",
    topics: [ "Test", "Test2" ]
  },
  {
    subject_id: "712",
    subjectName: "Maths",
    topics: [ "topic1", "Topic2" ]
  }
];

Answer 1

I think you could use something like this:

selectedSubjects = [
                     { subject_id: 711, topics: ["Test", "Test2"] },
                     { subject_id: 712, topics: ["topic1", "Topic2"] }
                   ]

theOtherSubjects = [
                     {subject_id: 711, subject_name: "Science"},
                     {subject_id: 712, subject_name: "Maths"}
                   ] // fixed the ids as I supposed the should be the same, otherwise it makes no sense with the provided data

let mergedSubjects = selectedSubjects.map(subject => {
    let otherSubject = theOtherSubjecs.find(element => element.subject_id === subject.subject_id)
    return { ...subject, ...otherSubject }
})