Array of products arrange by category

user_13662339 0
Viewed 200

I'm trying to arrange this array of products by categories. For now, I get the count of each category but I can't figure out how to make this two dimension array output.

let products = [
  {name: 'Tequila', category: 'drink'}, 
  {name: 'Beer', category: 'drink'}, 
  {name: 'Burger', category: 'food'},
  {name: 'Shawarma', category: 'food'}, 
  {name: 'Wine', category: 'drink'},
  {name: 'Gelatto', category: 'dessert'}
];

/*expected ouput

let arranged = [[
  {name: 'Tequila', category: 'drink'}, 
  {name: 'Beer', category: 'drink'},
  {name: 'Wine', category: 'drink'}
], [
  {name: 'Burger', category: 'food'},
  {name: 'Shawarma', category: 'food'}
], [
  {name: 'Gelatto', category: 'dessert'}
]];

*/

This is my code for now:

let products = [
  {name: 'Tequila', category: 'drink'}, 
  {name: 'Beer', category: 'drink'}, 
  {name: 'Burger', category: 'food'},
  {name: 'Shawarma', category: 'food'}, 
  {name: 'Wine', category: 'drink'},
  {name: 'Gelatto', category: 'dessert'}
];

let arranged = {};

products.map(x => arranged[x.category] = 1 + (arranged[x.category] || 0));

console.log(arranged);

mapping data-structures arrays javascript
3 Answers

Try this.I am using Array.prototype.reduce() to group the objects in array by category key ,then you can get the required data with Object.values()

let products = [{
    name: 'Tequila',
    category: 'drink'
  },
  {
    name: 'Beer',
    category: 'drink'
  },
  {
    name: 'Burger',
    category: 'food'
  },
  {
    name: 'Shawarma',
    category: 'food'
  },
  {
    name: 'Wine',
    category: 'drink'
  },
  {
    name: 'Gelatto',
    category: 'dessert'
  }
];



let group = products.reduce((r, a) => {


  r[a.category] = [...r[a.category] || [], a];
  return r;
}, {});
console.log(Object.values(group));

user_78495490

You can group elements by reducing over the array using an object to store elements belonging to each category. To get the grouped categories, we can use Object.values. 

let products = [{name: 'Tequila', category: 'drink'}, 
{name: 'Beer', category: 'drink'}, 
{name: 'Burger', category: 'food'},
{name: 'Shawarma', category: 'food'}, 
{name: 'Wine', category: 'drink'},
{name: 'Gelatto', category: 'dessert'}];
const res = Object.values(
  products.reduce((acc,curr)=>(
    (acc[curr.category] = acc[curr.category] || []).push(curr), acc
  ), {})
);
console.log(res);

user_95131840

I use reducer to go over the array. For builing the groups I use an index-array where I store the category. Before adding a new item I look if in this array exists the category. If so I take the index and just add to this index-th group the item. Otherwise I create a new grup-array to which I add the item.

let products = [{name: 'Tequila', category: 'drink'}, 
{name: 'Beer', category: 'drink'}, 
{name: 'Burger', category: 'food'},
{name: 'Shawarma', category: 'food'}, 
{name: 'Wine', category: 'drink'},
{name: 'Gelatto', category: 'dessert'}];

let categories=[];
let res = products.reduce((new_object, current_item) => {
    index = categories.indexOf(current_item.category);

    if (index==-1) {
        categories.push(current_item.category)
        new_object.push([current_item]);
    } else {
        new_object[index].push(current_item);
    }
    return new_object;
}, []);

console.log(res);

user_53245110
Related