Home > Back-end >  Unable to add second array object value into first array of objects in javascript
Unable to add second array object value into first array of objects in javascript

Time:10-24

hi i have two arrays i want to merge two arrays, can any one help one please, i have for used for loop pushing that values but its creating duplicates.

  const firstArray = [
    {
      first: "01",
      data: [{ id: "012345" }, { id: "0123456" }, { id: "0123457" }]
    },
    {
      first: "02",
      data: [{ id: "9998989" }, { id: "1223" }, { id: "345666" }]
    },
    {
      first: "03",
      data: [{ id: "567888" }, { id: "2345" }, { id: "09876" }]
    }
  ];
  const secondArray = [{ data: "abc" }, { data: "efg" }, { data: "hij" }];

I need result like this can any one,

[
  {
    first: "01",
    data: [
      { id: "012345", data: "abc" },
      { id: "0123456", data: "efg" },
      { id: "0123457", data: "hij" },
    ],
  },
  {
    first: "02",
    data: [
      { id: "9998989", data: "abc" },
      { id: "1223", data: "efg" },
      { id: "345666", data: "hij" },
    ],
  },
  {
    first: "03",
    data: [
      { id: "567888", data: "abc" },
      { id: "2345", data: "efg" },
      { id: "09876", data: "hij" },
    ],
  },
];

CodePudding user response:

Assuming the data array and second array size are same. Use nested map method calls to build the aggregation

const firstArray = [
  {
    first: "01",
    data: [{ id: "012345" }, { id: "0123456" }, { id: "0123457" }],
  },
  {
    first: "02",
    data: [{ id: "9998989" }, { id: "1223" }, { id: "345666" }],
  },
  {
    first: "03",
    data: [{ id: "567888" }, { id: "2345" }, { id: "09876" }],
  },
];
const secondArray = [{ data: "abc" }, { data: "efg" }, { data: "hij" }];

const output = firstArray.map(({ first, data }) => ({
  first,
  data: data.map((item, i) => ({ ...item, ...secondArray[i] })),
}));

console.log(output)
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

Rather than using nested for loops to build your array from scratch, you can instead use two .map() methods. One for mapping your outer objects in firstArray to new objects with a new data value, and another for mapping your data to a merged version from the data in secondArray. To merge, you can take the corresponding object from secondArray using the index and then using the spread syntax to merge both objects together:

const firstArray = [ { first: "01", data: [{ id: "012345" }, { id: "0123456" }, { id: "0123457" }] }, { first: "02", data: [{ id: "9998989" }, { id: "1223" }, { id: "345666" }] }, { first: "03", data: [{ id: "567888" }, { id: "2345" }, { id: "09876" }] } ];

const secondArray = [{ data: "abc" }, { data: "efg" }, { data: "hij"}];
const res = firstArray.map(obj => ({
  ...obj,
  data: obj.data.map((inner, i) => ({...inner, ...secondArray[i]}))
}));
console.log(res);
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

To fix your current implementation, you can create two arrays, one outside of your for loop like you currently are already doing, and then one inside your first for loop. The inner array will represent your new data array, which you can then update for your current object:

const firstArray = [{ first: "01", data: [{ id: "012345" }, { id: "0123456" }, { id: "0123457" }] }, { first: "02", data: [{ id: "9998989" }, { id: "1223" }, { id: "345666" }] }, { first: "03", data: [{ id: "567888" }, { id: "2345" }, { id: "09876" }] } ]; const secondArray = [{ data: "abc" }, { data: "123" }, { data: "xyz" }];

const emptyArray = [];
for (let i = 0; i < firstArray.length; i  ) {
  const data = firstArray[i].data;
  const dataArray = [];
  for (let j = 0; j < data.length; j  ) {
    const newObject = {
      ...data[j],
      ...secondArray[j]
    };
    dataArray.push(newObject);
  }
  emptyArray.push({...firstArray[i], data: dataArray});
}
console.log(emptyArray);
<iframe name="sif3" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

You can easily achieve the result using map in js

const firstArray = [
  {
    first: "01",
    data: [{ id: "012345" }, { id: "0123456" }, { id: "0123457" }],
  },
  {
    first: "02",
    data: [{ id: "9998989" }, { id: "1223" }, { id: "345666" }],
  },
  {
    first: "03",
    data: [{ id: "567888" }, { id: "2345" }, { id: "09876" }],
  },
];
const secondArray = [{ data: "abc" }, { data: "efg" }, { data: "hij" }];

const result = firstArray.map((obj) => ({
  ...obj,
  data: obj.data.map((o, i) => ({ ...o, ...secondArray[i] })),
}));
console.log(result);
<iframe name="sif4" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response:

according to your desired result you should do something like this:

let emptyArrray = [];
  for (let i = 0; i < firstArray.length; i  ) {
    const dataa = firstArray[i].data;
    for (let j = 0; j < dataa.length; j  ) {
      
        // console.log(secondArray[i]);
        let newObject = {
          ...secondArray[j],
          ...dataa[j]
        };
        emptyArrray.push(newObject);
      
    }
  } 

in your code you are getting 3*9 long array because you use nestled loop where you shouldn't, you just run over the array once, and add members from array two, also you used

  ...secondArray[i],
  ...dataa[i]

instead of

  ...secondArray[j],
  ...dataa[j]

when incrementing j in the for loop

  • Related