Question 199290 in Javascript Question posted in
A very good W3school tutorial can be found here.

Merge two objects by join field in javascript

I have project details , which I am getting from two calles, first call contains few fields and another one contains few fields of project details. I have to merge.

projectDetails1

[
  {
    ProjectID: 284,
    ProjectName: "Test Project June-30",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-00",
  },
  {
    ProjectID: 285,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-11",
  },
  {
    ProjectID: 286,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-22",
  }
]

projectDetails2

[
  {
    a_ID: "B1124-022571-00",
    Start_Date: "2022-05-09T00:00:00.000Z",
    End_Date: "2023-05-02T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
  {
    a_ID: "B1124-022571-11",
    Start_Date: "2022-04-04T00:00:00.000Z",
    End_Date: "2022-12-30T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
]

Need to merge both and by aID and a_ID is common(joining) fields.

finalProjectDeatils:

[
  {
    ProjectID: 284,
    ProjectName: "Test Project June-30",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-00",
    Start_Date: "2022-05-09T00:00:00.000Z",
    End_Date: "2023-05-02T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
  {
    ProjectID: 285,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-11",
    Start_Date: "2022-04-04T00:00:00.000Z",
    End_Date: "2022-12-30T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
  {
    ProjectID: 286,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-22",
  }
]
Tags:

3

Answers


  1. 0

    Make a a lookup object out of projectDetails2:

    const projectDetails2Lookup = {}
projectDetails2.forEach(item => {
  item = { ...item }
  projectDetails2Lookup[item.a_ID] = { ...item }
  delete item.a_ID
})

    Then merge each element from projectDetails1 with a corresponding element from the lookup object, if possible:

    const finalProjectDetails = projectDetails1.map(item =>
  ({
    ...item,
    ...(projectDetails2Lookup[item.AID] ?? {})
  })
)
    Login or Signup to reply.
  2. 0

    You could use reduce to merge each item under its AID or a_ID key, then take the values of the resulting object.

    Concatenate the two arrays.

    const [...d1, ...d2]

    Run reduce on the combined array.

    const [...d1, ...d2].reduce( // ....

    Within the reducer function, extract AID from the item, and use a_ID as a fallback. This captures the id in AID for either case and has the side effect of removing a_ID from the results. Capture the remaining attributes with a rest operator (...other).

    .reduce(acc, {a_ID, AID = a_ID, ...other}) => // ...

    Merge the attributes into the accumulator object under the ID key. If the key has already been encountered this will merge the current item’s attributes into the prior entry. Return the updated accumulator for the next iteration.

    acc[AID] = { AID, ...acc[AID], ...other };
return acc;

    Finally, extract the merged values via Object.values.

    const merged = Object.values(byId);

    const d1 = [
  {
    ProjectID: 284,
    ProjectName: "Test Project June-30",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-00",
  },
  {
    ProjectID: 285,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-11",
  },
  {
    ProjectID: 286,
    ProjectName: "Test Project June-28",
    Budget: 10000,
    BudgetMoney: "10,000.00",
    BriefStatus: "Approved",
    ProjectStatus: "Estimating",
    AID: "B1124-022571-22",
  }
]

const d2 = [
  {
    a_ID: "B1124-022571-00",
    Start_Date: "2022-05-09T00:00:00.000Z",
    End_Date: "2023-05-02T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
  {
    a_ID: "B1124-022571-11",
    Start_Date: "2022-04-04T00:00:00.000Z",
    End_Date: "2022-12-30T00:00:00.000Z",
    Project_Type_ID: 12,
    Project_Type: "Ext. Delivery (T&M)",
    Active_YN: "Y",
    Committed_Revenue: 3000000,
    Revenue: 4000000,
  },
]

const byId = [...d1, ...d2].reduce((acc, {a_ID, AID = a_ID, ...other}) => {
  acc[AID] = { AID, ...acc[AID], ...other };
  return acc;
}, {});

const merged = Object.values(byId);

console.log(merged);
    Login or Signup to reply.
  3. 0 
    function mergeArrayOfOject(arr1, arr2){

    const obj1 = {};
    arr1.forEach( item => {
        obj1[item.a_ID] = item;
    })

    const result = arr2.map( item => {
       const  arr1Obj = obj1[item.a_ID];
        return {...item, ...arr1Obj}
    })
    return result;
    
}
mergeArrayOfOject(projectDetails1, projectDetails2);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search