Home > Software engineering >  React looping and creating new array with nested objects
React looping and creating new array with nested objects

Time:05-03

I have an array of documents:

    [{
      "name": "AAPL",
      "ownerTotals": {uid: "xxx", totaledAmount: 140 }, {uid: "yyy", totaledAmount: 10}
    },
    {
      "name": "TSLA",
      "ownerTotals": {uid: "xxx", totaledAmount: 11 }, {uid: "yyy", totaledAmount: 2}
    }]

and an array of owners:

{uid: "xxx"}, {uid: "yyy"}

I'm trying to create a new/(update) the owners object with a nested object that contains the positions they own. so I want to update owners to this format:

    [{uid: "xxx", "positions": [{name: "AAPL", totaledAmount: 140 },{name: "TSLA", totaledAmount: 11}] },
    {uid: "yyy", "positions": [{name: "AAPL", totaledAmount: 10 },{name: "TSLA", totaledAmount: 2}] }]

what's the best way to achieve this?

I was trying for something along the lines of

owners.forEach((owner) => {
        documents.forEach((document) => {
           document.ownerTotals.forEach((ownerTotal) => {
                if (ownerTotal.uid === owner.uid) {

                 }
             }
        })
     }
})

Not really sure what to do at the heart of each loop, and not even sure if ForEach is the most method way for this...I'm using modern react with hooks.

CodePudding user response:

You can do something like this:

const documents = [
  {
    name: "AAPL",
    ownerTotals: [
      { uid: "xxx", totaledAmount: 140 },
      { uid: "yyy", totaledAmount: 10 }
    ]
  },
  {
    name: "TSLA",
    ownerTotals: [
      { uid: "xxx", totaledAmount: 11 },
      { uid: "yyy", totaledAmount: 2 }
    ]
  }
];

const owners = [{ uid: "xxx" }, { uid: "yyy" }];

const res = owners.map(({ uid }) => {
  let ownedDocuments = [];
  documents.forEach((doc) => {
    let docFound = doc.ownerTotals.find(({ uid: docUid }) => docUid === uid);
    if (docFound) {
      ownedDocuments.push({
        name: doc.name,
        totaledAmount: docFound.totaledAmount
      });
    }
  });
  return {
    uid,
    positions: ownedDocuments
  };
});

console.log(res);

CodePudding user response:

You can use reduce to group positions by userid.

const positions =  [{
      "name": "AAPL",
      "ownerTotals": {uid: "xxx", totaledAmount: 140 }, {uid: "yyy", totaledAmount: 10}
    },
    {
      "name": "TSLA",
      "ownerTotals": {uid: "xxx", totaledAmount: 11 }, {uid: "yyy", totaledAmount: 2}
    }]

const posByUid = positions.reduce((acc, current) => {
 const name = current.name
 current.positions.forEach(position => {
   if (!acc[position.uid]) {
    acc[position.uid] = []
   }

   acc[position.uid] = {name, totaledAmount: position.totaledAmount}
 })
 return acc
}, {})
  • Related