'How do I transform the data from this API into an array of objects organized by a specific prop?
I'm getting this data from an API:
let dataFromApi = [
{
// lots of other props
name: 'super cool place',
address: 'address of food place',
classification: 'food',
},
{
// lots of other props
name: 'name of tech place',
address: 'address of tech place',
classification: 'tech',
},
{
// lots of other props
name: 'name of clothes place',
address: 'address of clothes place',
classification: 'clothes',
},
{
// lots of other props
name: 'name of of another clothes place',
address: 'address of another clothes place',
classification: 'clothes',
},
{
// lots of other props
name: 'name of of another tech place',
address: 'address of another tech place',
classification: 'tech',
},
]
What I'd like to do is create a new array of objects that has 2 things:
A prop called
classification;A prop called
establishments, which is an array of objects containing all the establishments matching the classification prop.
Meaning something like this:
let establishmentsArray = [
{
classification: 'food',
establishments: [
{
name: 'name of food place',
address: 'address of food place',
classification: 'food',
// rest of its props
},
// Lots of other food places places
],
},
{
classification: 'clothes',
establishments: [
{
name: 'name of clothes place',
address: 'address of clothes place',
classification: 'clothes',
// rest of its props
},
{
name: 'name of another clothes place',
address: 'address of another clothes place',
classification: 'clothes',
// rest of its props
},
// Lots of other clothes places
],
},
{
classification: 'tech',
establishments: [
{
name: 'name of tech place',
address: 'address of tech place',
classification: 'tech',
// rest of its props
},
{
name: 'name of another tech place',
address: 'address of another tech place',
classification: 'tech',
// rest of its props
},
// Lots of other tech places
],
},
]
Thanks for the help in advance!
Solution 1:[1]
Here is another example, you can use map.reduce:
const groupByClassification = (items) => {
const grouped = items.reduce((acc, cur) => {
if (cur.classification in acc) {
acc[cur.classification].establishments.push(cur);
return acc;
}
const newGroupItem: GroupedItem = {
classification: cur.classification,
establishments: [cur]
};
return {
...acc,
[cur.classification]: newGroupItem
};
}, {} });
return Object.values(grouped);
};
Solution 2:[2]
let dataFromApi = [
{
// lots of other props
name: 'super cool place',
address: 'address of food place',
classification: 'food',
},
{
// lots of other props
name: 'name of tech place',
address: 'address of tech place',
classification: 'tech',
},
{
// lots of other props
name: 'name of clothes place',
address: 'address of clothes place',
classification: 'clothes',
},
{
// lots of other props
name: 'name of of another clothes place',
address: 'address of another clothes place',
classification: 'clothes',
},
{
// lots of other props
name: 'name of of another tech place',
address: 'address of another tech place',
classification: 'tech',
},
]
function GroupByClassification(data){
var groupedData = {};
for (const element of data) {
if(!(element.classification in groupedData)){
groupedData[element.classification] = [element];
}else{
groupedData[element.classification].push(element);
}
}
return groupedData;
}
console.log(GroupByClassification(dataFromApi));
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Shamil Mammadov |
| Solution 2 | Ivan Ambla |
