I have an object array like so:
const data = [
{category: {id: 1, name: 'beverage'}, title: 'Tea'},
{category: {id: 1, name: 'beverage'}, title: 'Coffee'},
{category: {id: 2, name: 'snacks'}, title: 'French fries'},
];
I want the result like so:
const transformed = [
{
category: "beverage",
data: [{title:'coffee'},{title:'tea'}, ...]
},
{
category: "snacks",
data: [{title:'french fries'},...]
},
..
]
What i did was:
let transformed = data?.map(function (obj) {
var result = {
category: obj.category.title,
data: [],
};
for (var key in obj) {
if (obj.hasOwnProperty(key) && key === 'category') {
result.values.push(obj);
}
}
return result;
});
But with this approach i am getting duplicate category names for every object in the array.
You could group by name of category and use an object for getting groupd values.
const
data = [{ category: { id: 1, name: 'beverage' }, title: 'Tea' }, { category: { id: 1, name: 'beverage' }, title: 'Coffee' }, { category: { id: 2, name: 'snacks' }, title: 'French fries' }],
result = Object.values(data.reduce((r, { category: { name: category }, title }) => {
(r[category] ??= { category, data: [] }).data.push({ title });
return r;
}, {}));
console.log(result);.as-console-wrapper { max-height: 100% !important; top: 0; }As with all grouping operations the key is to use reduce to build up a new object.
const data = [
{category: {id: 1, name: 'beverage'}, title: 'Tea'},
{category: {id: 1, name: 'beverage'}, title: 'Coffee'},
{category: {id: 2, name: 'snacks'}, title: 'French fries'},
];
const result = Object.values(data.reduce( (a,i) => {
a[i.category.id] = a[i.category.id] || {category:i.category.name, data:[]};
a[i.category.id].data.push({title:i.title});
return a;
},{}));
console.log(result);Check this out
const data = [
{category: {id: 1, name: 'beverage'}, title: 'Tea'},
{category: {id: 1, name: 'beverage'}, title: 'Coffee'},
{category: {id: 2, name: 'snacks'}, title: 'French fries'},
];
const transform = (data) => {
const grouped = data.reduce((acc, obj) => {
const { category: { id, name }, title } = obj;
acc[id] = (acc[id])
? {
...acc[id],
data: [...acc[id].data, { title }],
}
: { category: name, data: [{ title }] };
return acc;
}, {});
return Object.values(grouped);
};
console.dir(transform(data), {depth: null});
// [
// { category: 'beverage', data: [{ title: 'Tea' }, { title: 'Coffee' }] },
// { category: 'snacks', data: [{ title: 'French fries' }]}
// ]