Unable to add second array object value into first array of objects in javascript

Question

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" },
    ],
  },
];

Can you show what the expected output would look like if secondArray has [{ data: "abc" }, { data: "123" }, { data: "xyz" }] instead. Its currently unclear how the data from the secondArray maps to the first. Would you also be able to add your attempt using the for loop — Nick Parsons
– Nick Parsons, Commented Oct 24, 2021 at 6:11

Nick Parsons · Accepted Answer · 2021-10-24 06:33:38Z

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);

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);

Siva Kondapi Venkata · Accepted Answer · 2021-10-24 06:20:06Z

4

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)

answered Oct 24, 2021 at 6:20

Siva Kondapi Venkata

11.1k2 gold badges20 silver badges32 bronze badges

Comments

DecPK · Accepted Answer · 2021-10-24 06:20:51Z

3

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);

answered Oct 24, 2021 at 6:20

DecPK

25.4k6 gold badges32 silver badges46 bronze badges

Comments

Michael Razgoner · Accepted Answer · 2021-10-24 06:30:39Z

0

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

answered Oct 24, 2021 at 6:30

Michael Razgoner

1342 silver badges9 bronze badges

Collectives™ on Stack Overflow

Unable to add second array object value into first array of objects in javascript

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related