How to group same element in array

Question

I have this array:

var cart = [
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Pizza",
   price: "4.00",
},
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Hot Dog",
   price: "2.00",
},
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Eggs",
   price: "3.00",
}
]

Now I print this array with:

var dataCart = "";
    for (i = 0; i < cart.length; i++){
    var rand = Math.floor(Math.random()*1000)+1;
        dataCart += "<div id='"+rand+"' class='row pb-3 mx-3 mt-3' style='border-bottom:1px solid #eeeeee;'>";
        dataCart += "<div id='fs-7' class='col-2 text-center font-weight-bold'>";
        dataCart += "1x";
        dataCart += "</div>";
        dataCart += "<div id='fs-7' class='col-5'>";
        dataCart += cart[i].title;
        dataCart += "</div>";
        dataCart += "<div class='col-3 font-weight-bold text-right' style='color:#27c727;' id='price-app'>";
        dataCart += parseFloat(cart[i].price).toFixed(2).toLocaleString()+" €";
        dataCart += "</div>";
        dataCart += "<div onclick='deleteItem("+i+","+rand+")' class='col-2'><img src='delete.png' style='max-height:20px;' class='img-fluid' /></div>";
        dataCart += "</div>";
    }

    $("#list-cart").html(dataCart);

With this code, I print all list of object

1x Pasta 6.00$<br>
1x Pizza 4.00$<br>
1x Pasta 6.00$<br>
1x Hot Dog 2.00$<br>
1x Pasta 6.00$<br>
1x Eggs 3.00$<br>

But I want to group for quantity > 1:

3x Pasta 18.00$<br>
1x Pizza 4.00$<br>
1x Hot Dog 2.00$<br>
1x Eggs 3.00$<br>

Nick · Accepted Answer · 2020-06-04 11:50:28Z

2

You can use the Array reduce method to reduce this down to an array of unique items with a new count property. You can use this new prop in your dataCart code.

var cart = [
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Pizza",
   price: "4.00",
},
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Hot Dog",
   price: "2.00",
},
{
   name: "Pasta",
   price: "6.00",
},
{
   name: "Eggs",
   price: "3.00",
}
]

const grouped = cart.reduce((acc, el) => {
  const found = acc.find(item => item.name === el.name);
  if (found) {
    found.count++;
    found.price += Number(el.price);
  } else {
    acc.push({...el, count: 1, price: Number(el.price)});
  }
  return acc;
}, [])

console.log(grouped);

edited Jun 4, 2020 at 11:50

answered Jun 4, 2020 at 11:45

Nick

16.7k3 gold badges21 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rajneesh · Accepted Answer · 2020-06-04 11:46:13Z

1

You can reduce it and take values:

var cart = [{ name: "Pasta", price: "6.00",},{ name: "Pizza", price: "4.00",},{ name: "Pasta", price: "6.00",},{ name: "Hot Dog", price: "2.00",},{ name: "Pasta", price: "6.00",},{ name: "Eggs", price: "3.00",}];

var result = Object.values(cart.reduce((acc,{name, price})=>{
    acc[name] = acc[name] || {name, price:0, count:0 };
    acc[name].price+=+price;
    acc[name].count++;
    return acc;
},{}));

console.log(result);

answered Jun 4, 2020 at 11:46

Rajneesh

5,3181 gold badge10 silver badges20 bronze badges

Comments

Siva Kondapi Venkata · Accepted Answer · 2020-06-04 11:55:32Z

0

Build an object with values of quantity and price aggregation.

const group = (arr) => {
  const res = {};
  arr.forEach(({ name, price }) => {
    if (!res[name]) {
      res[name] = { name, quantity: 1, sub_total: Number(price) };
    } else {
      res[name].quantity += 1;
      res[name].sub_total += Number(price);
    }
  });
  return Object.values(res);
};

var cart = [
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Pizza",
    price: "4.00",
  },
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Hot Dog",
    price: "2.00",
  },
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Eggs",
    price: "3.00",
  },
];



console.log(group(cart));

answered Jun 4, 2020 at 11:55

Siva Kondapi Venkata

11.1k2 gold badges20 silver badges32 bronze badges

Comments

ganesh phirke · Accepted Answer · 2020-06-04 12:04:10Z

0

You can use groupBy and take simply length of the array for the count:-

use groupByResult for displaying your result.

var cart = [
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Pizza",
    price: "4.00",
  },
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Hot Dog",
    price: "2.00",
  },
  {
    name: "Pasta",
    price: "6.00",
  },
  {
    name: "Eggs",
    price: "3.00",
  },
];


function groupBy(groupBy) {
  var groupByResult = {};
  for (var ele of cart) {
    if (!groupByResult[ele[groupBy]]) {
      groupByResult[ele[groupBy]] = [];
    }
     groupByResult[ele[groupBy]].push(ele);
  }
  console.log(groupByResult);
}

groupBy("name")

answered Jun 4, 2020 at 12:04

ganesh phirke

4731 gold badge3 silver badges12 bronze badges

Collectives™ on Stack Overflow

How to group same element in array

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related