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

Javascript – Merging arrays js

I have a data array:

[
   { name: '1', goalsTable: 6544b8a5fea0bf50fc0c62fb },
   { name: '1fork', goalsTable: 6548740f05dc440b5c61c5ac }
]

I have a goalsData array:

[
   {
     _id: 6544b8a5fea0bf50fc0c62fb,
     tableData: [ [Object], [Object], [Object], [Object] ],
     goalsData: { qty: 12 }
   },
   {
     _id: 6548740f05dc440b5c61c5ac,
     tableData: [ [Object], [Object], [Object], [Object], [Object] ],
     goalsData: { qty: 10 }
   }
 ]

What I want is to merge the object if the id matches with each other. Like for example, if _id of first object of goalsData matches with the goalsTable of data, then the data object becomes:

[{
   name: '1', 
   goalsTable: 6544b8a5fea0bf50fc0c62fb, 
   tableData: [ [Object], [Object], [Object], [Object] ], 
   goalsData: { qty: 12 } 
}]
Tags:

3

Answers


  1. 0

    The objective can be achieved easily if you convert the second array into a lookup object:

    const arr = [{name:"1", goalsTable: "6544b8a5fea0bf50fc0c62fb"}, { name: "1fork", goalsTable: "6548740f05dc440b5c61c5ac" } ],
 goalsData = [ { "_id": "6544b8a5fea0bf50fc0c62fb", tableData: [ "o1","o2","o3","o4" ], goalsData: { qty: 12 } }, { _id: "6548740f05dc440b5c61c5ac", tableData: [ "o5", "o6", "o7", "o8" ], goalsData: { qty: 10 } } ];

// prepare the lookup object:
const goals=goalsData.reduce((a,c)=>{
 a[c._id]={...c};
 delete a[c._id]._id;
 return a; 
},{});

// Combine the two:

const res= arr.map(c=>({...c, ...(goals[c.goalsTable]??{})}));

console.log(res);

    Using a lookup object requires more memory but it will speed up the matching process. This becomes more important for large arrays.

    Login or Signup to reply.
  2. 0

    If I understand you correctly you are trying to match the _id of one array with the goalstable key of the other array. To do this You might want to loop over both arrays. I used the .map function to loop over both arrays in a nested form and with an if statement I checked whether the latter values matched, if so, I added the values to the initial array.

    arr.map((value, index) => {
  arr2.map((value2, index2) => {
    if (value.goalsTable == value2._id) {
      arr[index]["_id"] = value2._id;
      arr[index]["tableData"] = value2.tableData;
      arr[index]["goalsData"] = value2.goalsData;
    }
  });
});

    Tested the result in the following snippet and they are working fine.

    let arr = [{
    name: "1",
    goalsTable: "6544b8a5fea0bf50fc0c62fb"
  },
  {
    name: "1fork",
    goalsTable: "6548740f05dc440b5c61c5ac"
  },
];

let arr2 = [{
    _id: "6544b8a5fea0bf50fc0c62fb",
    tableData: [
      [Object],
      [Object],
      [Object],
      [Object]
    ],
    goalsData: {
      qty: 12
    },
  },
  {
    _id: "6548740f05dc440b5c61c5ac",
    tableData: [
      [Object],
      [Object],
      [Object],
      [Object],
      [Object]
    ],
    goalsData: {
      qty: 10
    },
  },
];

arr.map((value, index) => {
  arr2.map((value2, index2) => {
    if (value.goalsTable == value2._id) {
      arr[index]["_id"] = value2._id;
      arr[index]["tableData"] = value2.tableData;
      arr[index]["goalsData"] = value2.goalsData;
    }
  });
});

console.log(arr);
    Login or Signup to reply.
  3. 0

    Wit lodash we can handle your case like this one. You can implement omit by yourself but I think it’s more convenient because most of JS project will use lodash.

    import { omit } from 'lodash';

const a = [
  { name: '1', goalsTable: '6544b8a5fea0bf50fc0c62fb' },
  { name: '1fork', goalsTable: '6548740f05dc440b5c61c5ac' },
];

const b = [
  {
    _id: '6544b8a5fea0bf50fc0c62fb',
    tableData: [[Object], [Object], [Object], [Object]],
    goalsData: { qty: 12 },
  },
  {
    _id: '6548740f05dc440b5c61c5ac',
    tableData: [[Object], [Object], [Object], [Object], [Object]],
    goalsData: { qty: 10 },
  },
];

const result = a.map((item) => {
  const bTmp = b.find((bItem) => bItem._id === item.goalsTable);

  return {
    ...item,
    ...omit(bTmp, '_id'),
  };
});

console.log('result :', result);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search