将 3 个键的 object 转换为数组

Question

I'm new to React. I'm building my first project. In the project I use api. I get this object from the api:

{
"cases": {
"10/6/20": 35806972,
"10/7/20": 36156226,
"10/8/20": 36515563,
"10/9/20": 36876248,
"10/10/20": 37105925
},
"deaths": {
"10/6/20": 1049875,
"10/7/20": 1055683,
"10/8/20": 1061877,
"10/9/20": 1068040,
"10/10/20": 1071388
},
"recovered": {
"10/6/20": 24834868,
"10/7/20": 25088883,
"10/8/20": 25306451,
"10/9/20": 25509379,
"10/10/20": 25610521
}

And I want to turn it into an array of this kind:

[{
"date":"10/6/20",
"cases": 35806972,
"deaths": 1049875,
"recovered":24834868
},
{},
{},
{},
{}
]

Each element in the array will be an object consisting of a date, and a number of patients, a number of recovering and dying on the same date.

i dont have any idea how to do that. It's not complex, but I have no idea how to implement it

Answer 1

You can use Object.keys and array map method.

 let data = { "cases": { "10/6/20": 35806972, "10/7/20": 36156226, "10/8/20": 36515563, "10/9/20": 36876248, "10/10/20": 37105925 }, "deaths": { "10/6/20": 1049875, "10/7/20": 1055683, "10/8/20": 1061877, "10/9/20": 1068040, "10/10/20": 1071388 }, "recovered": { "10/6/20": 24834868, "10/7/20": 25088883, "10/8/20": 25306451, "10/9/20": 25509379, "10/10/20": 25610521 }} let keys = Object.keys(data.cases); let modifiedData = keys.map(key => ({ date: key, cases: data.cases[key], deaths: data.deaths[key], recovered: data.recovered[key] })); console.log("modifiedData", modifiedData)

Answer 2

Using Array.reduce , you can get the new object grouped by date key from the input.

After getting the grouped by date object, using Object.entries & Array.map , you can get the result you want.

 const input = { "cases": { "10/6/20": 35806972, "10/7/20": 36156226, "10/8/20": 36515563, "10/9/20": 36876248, "10/10/20": 37105925 }, "deaths": { "10/6/20": 1049875, "10/7/20": 1055683, "10/8/20": 1061877, "10/9/20": 1068040, "10/10/20": 1071388 }, "recovered": { "10/6/20": 24834868, "10/7/20": 25088883, "10/8/20": 25306451, "10/9/20": 25509379, "10/10/20": 25610521 } }; const groupByDate = Object.entries(input).reduce((acc, cur) => { Object.entries(cur[1]).forEach(([ date, value ]) => { acc[date]? acc[date][cur[0]] = value: acc[date] = { [cur[0]]: value }; }); return acc; }, {}); const result = Object.entries(groupByDate).map(([ date, value ]) => ({ date, ...value })); console.log(result);

Answer 3

A bit of a long one but here it is:

 const data = { cases: { '10/6/20': 35806972, '10/7/20': 36156226, '10/8/20': 36515563, '10/9/20': 36876248, '10/10/20': 37105925, }, deaths: { '10/6/20': 1049875, '10/7/20': 1055683, '10/8/20': 1061877, '10/9/20': 1068040, '10/10/20': 1071388, }, recovered: { '10/6/20': 24834868, '10/7/20': 25088883, '10/8/20': 25306451, '10/9/20': 25509379, '10/10/20': 25610521, }, }; // 5. Get all the values from the reduce to have an array instead of an object const newData = Object.values( // 1. Loop over all the keys in the object Object.keys(data).reduce((all, key) => { // 2. Loop over all the dates in the current object at the current key Object.keys(data[key]).forEach((date) => { // 3. Check if in the 'all' object there is an key for the current date if not create one with date inside all[date] = all[date] || { date: date }; // 4. Inside the all object at the current date and then at the current key add the data at current key in the current date all[date][key] = data[key][date]; }); return all; }, []) ); console.warn(newData);

Answer 4

Loop over dates of the first random element, as all of them have the same date list.

 let data = _get_data(); let result = []; for (let date in data.oranges) { // in Object.values(data)[0] let obj = { date }; // shorthand of { "date": date } for (let food in data) { obj[food] = data[food][date]; } result.push(obj); } console.log( result ); /***/ function _get_data() { return { "oranges": { "10/6/20": 35806972, "10/7/20": 36156226, "10/8/20": 36515563, "10/9/20": 36876248, "10/10/20": 37105925 }, "bananas": { "10/6/20": 1049875, "10/7/20": 1055683, "10/8/20": 1061877, "10/9/20": 1068040, "10/10/20": 1071388 }, "potatoes": { "10/6/20": 24834868, "10/7/20": 25088883, "10/8/20": 25306451, "10/9/20": 25509379, "10/10/20": 25610521 } }; }

Answer 5

const data = {
    "cases": {
    "10/6/20": 35806972,
    "10/7/20": 36156226,
    "10/8/20": 36515563,
    "10/9/20": 36876248,
    "10/10/20": 37105925
    },
    "deaths": {
    "10/6/20": 1049875,
    "10/7/20": 1055683,
    "10/8/20": 1061877,
    "10/9/20": 1068040,
    "10/10/20": 1071388
    },
    "recovered": {
    "10/6/20": 24834868,
    "10/7/20": 25088883,
    "10/8/20": 25306451,
    "10/9/20": 25509379,
    "10/10/20": 25610521
    }};

const dataArray = [];
Object.keys(data.cases).map((date)=>{
dataArray.push({
    date,
    cases: data.cases[date],
    deaths:data.deaths[date],
    recovered:data.recovered[date],
})
})
console.log(dataArray);

Answer 6

There are different ways of achieving the output you are looking for. Here is one among them, I have used Object.keys , Object.entries and Object.values along with Array.forEach

 let data = {cases:{'10/6/20':35806972,'10/7/20':36156226,'10/8/20':36515563,'10/9/20':36876248,'10/10/20':37105925},deaths:{'10/6/20':1049875,'10/7/20':1055683,'10/8/20':1061877,'10/9/20':1068040,'10/10/20':1071388},recovered:{'10/6/20':24834868,'10/7/20':25088883,'10/8/20':25306451,'10/9/20':25509379,'10/10/20':25610521}}; const formatData = (data) => { const finalRes = {}; Object.keys(data).forEach(key => { Object.entries(data[key]).forEach(([date, val]) => { //Creating/Updating the object with key as `date` in the //finalRes object with the other properties such as `cases`, `deaths` and `recovered` finalRes[date] = {...finalRes[date], date, [key]: val } }) }); //Finally, converting the object values to an array return Object.values(finalRes); } console.log(formatData(data));

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