What methods should I use to modify the upcoming array of objects?

Question

What methods should I use to modify the upcoming array of objects?

I have been struggling with this exercise for about an hour now, and I can't figure it out. Can someone please help me with this?

Here is the array that I retrieved from the database: View Base Array Image

let data = [
{
"name": "October : 2019",
"userName": "Katherine Diaz",
"newCases": 875,
"recover": 8
},
// more data here...
]

I would like to transform the data as follows for testing purposes. Here's a snippet of what I want to achieve: View Transformation Image

let transformedData = [
{
    name: 'October',
    user: ['Katherine Diaz', 'Belyini Cabral', 'Mercedes Perez', 'N/A'],
    newCases: [/* random numbers */],
    recovered: [/* random numbers */],
    monthRecovered: /* random number */,
    monthNewCases: /* random number */
},
// more transformed data here...
];

This seems a bit complex for me at the moment. I believe I need more understanding of data structures in this language. Could someone point me in the right direction and provide some steps to get started? Thank you.

javascript arrays json object

Answer 1

Answer №1

To group objects and extract their values as an array of objects, you can use a specified object for grouping.

var data = [{ name: "October : 2019", user: "Alice Smith", sales: 100, profit: 50 }, { name: "November : 2019", user: "Bob Johnson", sales: 200, profit: 70 }, { name: "December : 2019", user: "Cathy Brown", sales: 150, profit: 30 }],
    result = Object.values(data.reduce((obj, { name, user, sales, profit }) => {
        if (!obj[name]) obj[name] = { name, users: [], salesData: [], profits: [] };
        obj[name].users.push(user);
        obj[name].salesData.push(sales);
        obj[name].profits.push(profit);
        return obj;
    }, {}));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To group objects and extract their values as an array of objects, you can use a specified object for grouping.

var data = [{ name: "October : 2019", user: "Alice Smith", sales: 100, profit: 50 }, { name: "November : 2019", user: "Bob Johnson", sales: 200, profit: 70 }, { name: "December : 2019", user: "Cathy Brown", sales: 150, profit: 30 }],
    result = Object.values(data.reduce((obj, { name, user, sales, profit }) => {
        if (!obj[name]) obj[name] = { name, users: [], salesData: [], profits: [] };
        obj[name].users.push(user);
        obj[name].salesData.push(sales);
        obj[name].profits.push(profit);
        return obj;
    }, {}));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

To populate the premiere data, it is necessary to loop through the response array.

var response=... (same as in original post),
    premiere=[],
    keys={};
for(var i=0;i<response.length;i++) {
    var element=response[i];

    //Parsing the element name may be required to remove the year
    var name=element.name;

    //Tracking where each name is located in premiere is crucial
    var index;
    if(!keys.hasOwnProperty(name)) {
        //If the name does not exist, create it and assign values later
        index=premiere.push({
            name:name,
            user:[],
            newCases:[],
            recovered:[],
            monthNewCases:0,
            monthRecovered:0
        })-1;
        //Store the index of the name in keys
        keys[name]=index;
    } else {
        //If the name exists, get its index to append new data
        index=keys[name];
    }      

    //Ensure no duplicates by checking for existing user names
    //Push the user name if it does not already exist
    if(premiere[name].user.indexOf(element.userName)<0) premiere[name].user.push(element.userName);

    premiere[name].newCases.push(element.newCases);
    premiere[name].recovered.push(element.recover);

    //Update the total new cases and recoveries for the month
    premiere[name].monthNewCases+=element.newCases;
    premiere[name].monthRecovered+=element.recover;
}

This code has not been tested yet.

Answer 4

To populate the premiere data, it is necessary to loop through the response array.

var response=... (same as in original post),
    premiere=[],
    keys={};
for(var i=0;i<response.length;i++) {
    var element=response[i];

    //Parsing the element name may be required to remove the year
    var name=element.name;

    //Tracking where each name is located in premiere is crucial
    var index;
    if(!keys.hasOwnProperty(name)) {
        //If the name does not exist, create it and assign values later
        index=premiere.push({
            name:name,
            user:[],
            newCases:[],
            recovered:[],
            monthNewCases:0,
            monthRecovered:0
        })-1;
        //Store the index of the name in keys
        keys[name]=index;
    } else {
        //If the name exists, get its index to append new data
        index=keys[name];
    }      

    //Ensure no duplicates by checking for existing user names
    //Push the user name if it does not already exist
    if(premiere[name].user.indexOf(element.userName)<0) premiere[name].user.push(element.userName);

    premiere[name].newCases.push(element.newCases);
    premiere[name].recovered.push(element.recover);

    //Update the total new cases and recoveries for the month
    premiere[name].monthNewCases+=element.newCases;
    premiere[name].monthRecovered+=element.recover;
}

This code has not been tested yet.

Answer 5

Answer №3

Take a look at Array.reduce method to loop through the response data and construct a new array:

const response = [
  {
    "name": "October : 2019",
    "userName": "Katherine Diaz",
    "newCases": 875,
    "recover": 8
  },
  {
    "name": "December : 2019",
    "userName": "A guy named Jeff",
    "newCases": 503,
    "recover": 380
  },
  {
    "name": "December : 2019",
    "userName": "Patient Zero",
    "newCases": 999,
    "recover": 38
  },
];

const result = response.reduce((acc, item) => {
  // create a new entry for this item's name if it doesn't already exist
  const bin = acc[item.name] = acc[item.name] || { user: [], newCases: [], recovered: [] };

  // add the fields we care about to this entry
  bin.user.push(item.userName);
  bin.newCases.push(item.newCases);
  bin.recovered.push(item.recover);
  
  // return the updated accumulator for the next iteration
  return acc;
}, {})

document.getElementById('output').innerText = JSON.stringify(result, null, 2);

<pre id="output"></pre>

Answer 6

Take a look at Array.reduce method to loop through the response data and construct a new array:

const response = [
  {
    "name": "October : 2019",
    "userName": "Katherine Diaz",
    "newCases": 875,
    "recover": 8
  },
  {
    "name": "December : 2019",
    "userName": "A guy named Jeff",
    "newCases": 503,
    "recover": 380
  },
  {
    "name": "December : 2019",
    "userName": "Patient Zero",
    "newCases": 999,
    "recover": 38
  },
];

const result = response.reduce((acc, item) => {
  // create a new entry for this item's name if it doesn't already exist
  const bin = acc[item.name] = acc[item.name] || { user: [], newCases: [], recovered: [] };

  // add the fields we care about to this entry
  bin.user.push(item.userName);
  bin.newCases.push(item.newCases);
  bin.recovered.push(item.recover);
  
  // return the updated accumulator for the next iteration
  return acc;
}, {})

document.getElementById('output').innerText = JSON.stringify(result, null, 2);

<pre id="output"></pre>

What methods should I use to modify the upcoming array of objects?

Answer №1

Answer №2

Answer №3

Similar questions

Retrieve data from a specific field in a JSON response

How can I store unique and only selected checkbox values in an array using Angular?

Tips for submitting an e-mail through an HTML form with the help of Node.js and Gulp

The Bootstrap tooltip fails to function properly following a page update or refresh

Adding npm packages to your Vue.js application

Experimenting with a custom AngularJS filter designed to extract numerical values from a chunk of text

issue with for loop in jquery ajax not processing complete response data

Tips for converting data to JSON format without the need for an object

What is the process for converting plain text into an image tag using the methods ".replace()" and ".html()"?

Replicating JavaScript functions with the power of Ajax

Issue encountered with Bing webmaster API when retrieving keyword statistics: an unknown error occurred resulting in an empty

Using AngularJS directives in Markdown

Verify the visibility of the toggle, and eliminate the class if it is hidden

Tips for choosing elements that are not next to each other in a JavaScript array

Unable to utilize Bower due to a node.js malfunction

Ways to extract information from JSON files

Error 403 occurs after submitting the form

Is there a way to retrieve files stored on my hard drive within a webpage?

Executing an Angular 4 script using a scheduled CRON job

What are the steps for updating an NPM package that was installed from a Git repository?