Transforming a JavaScript object into a different shape

Question

Transforming a JavaScript object into a different shape

I need help converting a list of team objects containing team names, reporters, and statuses for each day into date-based objects with all teams and their respective statuses for each date.

I attempted the following code snippet but did not achieve the desired outcome.

teams.map(team => ({
    day: team.statuses.reduce((acc, it) => it.day),
    teams: {
        teamName: team.teamName
    }
}))

[
   {
      "teamName":"abc",
      "reportedBy": "user1",
      "statuses":[
         {
            "day":"10/12",
            "status":"green"
         },
         {
            "day":"10/11",
            "status":"green"
         },
         {
            "day":"10/09",
            "status":"green"
         }
      ]
   },
    {
      "teamName":"xyz",
      "reportedBy": "user2",
      "statuses":[
         {
            "day":"10/12",
            "status":"red"
         },
         {
            "day":"10/11",
            "status":"red"
         },
         {
            "day":"10/09",
            "status":"red"
         }
      ]
   }

]

The expected output should be:

[
  {
    "day": "1012",
    "teams": [
      {
        "teamName": "abc",
        "reportedBy": "user1",
        "status": "green"
      },
      {
        "teamName": "xyz",
        "reportedBy": "user2",
        "status": "red"
      }
    ]
  },
  {
    "day": "1011",
    "teams": [
      {
        "teamName": "abc",
        "reportedBy": "user1",
        "status": "green"
      },
      {
        "teamName": "xyz",
        "reportedBy": "user2",
        "status": "red"
      }
    ]
  },
  {
    "day": "1009",
    "teams": [
      {
        "teamName": "abc",
        "reportedBy": "user1",
        "status": "green"
      },
      {
        "teamName": "xyz",
        "reportedBy": "user2",
        "status": "red"
      }
    ]
  }
]

javascript arrays json mapreduce

Answer 1

Answer №1

It seems that creating an empty array and populating it as you go might be a more suitable approach instead of using the reduce method in this scenario:

let input = [
   {
      "teamName":"abc",
      "reportedBy": "user1",
      "statuses":[
         {
            "day":"10/12",
            "status":"green"
         },
         {
            "day":"10/11",
            "status":"green"
         },
         {
            "day":"10/09",
            "status":"green"
         }
      ]
   },
    {
      "teamName":"xyz",
      "reportedBy": "user2",
      "statuses":[
         {
            "day":"10/12",
            "status":"red"
         },
         {
            "day":"10/11",
            "status":"red"
         },
         {
            "day":"10/09",
            "status":"red"
         }
      ]
   }
];

let output = [];

input.forEach(team =>
{
  let name = team.teamName;
  let reporter = team.reporter
  team.statuses.forEach(status =>
  {
    let dayItem = output.find(item => item.day == status.day);
    if(dayItem == null)
    {
      let newItem = {day: status.day, teams:[{status: status.status, reportedBy: reporter, teamName: name}]};
      output.push(newItem);
    }
    else
    {
      dayItem.teams.push({status: status.status, reportedBy: reporter, teamName: name})
    }
  });
});

console.log(JSON.stringify(output));

Answer 2

It seems that creating an empty array and populating it as you go might be a more suitable approach instead of using the reduce method in this scenario:

let input = [
   {
      "teamName":"abc",
      "reportedBy": "user1",
      "statuses":[
         {
            "day":"10/12",
            "status":"green"
         },
         {
            "day":"10/11",
            "status":"green"
         },
         {
            "day":"10/09",
            "status":"green"
         }
      ]
   },
    {
      "teamName":"xyz",
      "reportedBy": "user2",
      "statuses":[
         {
            "day":"10/12",
            "status":"red"
         },
         {
            "day":"10/11",
            "status":"red"
         },
         {
            "day":"10/09",
            "status":"red"
         }
      ]
   }
];

let output = [];

input.forEach(team =>
{
  let name = team.teamName;
  let reporter = team.reporter
  team.statuses.forEach(status =>
  {
    let dayItem = output.find(item => item.day == status.day);
    if(dayItem == null)
    {
      let newItem = {day: status.day, teams:[{status: status.status, reportedBy: reporter, teamName: name}]};
      output.push(newItem);
    }
    else
    {
      dayItem.teams.push({status: status.status, reportedBy: reporter, teamName: name})
    }
  });
});

console.log(JSON.stringify(output));

Answer 3

Answer №2

Here is a snippet of code that I have experimented with:

  const dayMapped = {};
  const dailyStatuses = [];

  teams.forEach((team) => {
        team.statuses.forEach((status) => {
            status.day = status.day.replace(/\//g, '');
            if (!dayMapped[status.day]) {
                dayMapped[status.day] = {
                    day: status.day,
                    teams: []
                };
                dailyStatuses.push(dayMapped[status.day]);
            }
    
            dayMapped[status.day].teams.push({
                teamName: team.teamName,
                reportedBy: team.reportedBy,
                status: status.status   
            });
        });
    });

Answer 4

Here is a snippet of code that I have experimented with:

  const dayMapped = {};
  const dailyStatuses = [];

  teams.forEach((team) => {
        team.statuses.forEach((status) => {
            status.day = status.day.replace(/\//g, '');
            if (!dayMapped[status.day]) {
                dayMapped[status.day] = {
                    day: status.day,
                    teams: []
                };
                dailyStatuses.push(dayMapped[status.day]);
            }
    
            dayMapped[status.day].teams.push({
                teamName: team.teamName,
                reportedBy: team.reportedBy,
                status: status.status   
            });
        });
    });

Transforming a JavaScript object into a different shape

Answer №1

Answer №2

Similar questions

.class selector malfunctioning

Encountered an issue while trying to add images and text simultaneously in asp.net

What is the technique for retrieving the field type with the Jackson ObjectMapper?

Characteristics of JSON data containing quotation marks within the property values

Is there a way to make the React component automatically refresh upon clicking the search button?

The Google Books API has encountered an authentication error with status code 401

Is HTML-escaping necessary when implementing regex checks?

Exploring the integration of d3 in an Express application - encountering an error: document is not recognized

Using Angular to send data to a WCF JSON endpoint

Seeking specific parameter in a JSON array using JavaScript: A guide

Creating a canvas with multiple label introductions can be achieved by following these

Extracting POST information through PHP's AJAX Request

Toggle the selection of a div by clicking a button in AngularJS with a toggle function

Can you provide insight on the recommended methodology for aggregating JSON data effectively?

Having trouble with Jquery Ajax call in IE8?

The onblur function is not being triggered

Transforming Java Properties Into Nested Map to Obtain JSON Format

Mapping YAML file to a Java Map without using a custom deserializer

It is advisable to keep extra information in req.params for better practice

Does anyone have any sample code on processing JSON data from a URL using Modified JavaScript Value in Java?