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!
Looks like you're trying to group by single field which is a good use-case for array.reduce:
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',
},
]
let output = dataFromApi.reduce((acc, cur) => {
let { classification, ...rest} = cur;
let prev = acc.find(x => x.classification === classification);
if(!prev) {
acc.push({classification, establishments: [cur]});
} else {
prev.establishments.push(cur);
}
return acc;
}, []);
console.log(output);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);
};
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));