如何在数组中对相同元素进行分组

Question

我有这个数组：

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 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);

使用此代码，我可以打印对象的所有列表

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>

但我想对数量大于1的分组：

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

Answer 1

您可以使用数组reduce方法将其缩减为具有新count属性的唯一项的数组。您可以在dataCart代码中使用这个新属性。

​

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);

​

Answer 2

你可以reduce它，然后使用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);

​

Answer 3

构建一个具有数量和价格聚合值的对象。

​

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));

​