Javascript 使用jquery按日期分组json对象数组

我在将带有json对象的数组打印为html时遇到问题。我使用的原始代码是javascrit对象的“购物车”

以及“ShoppinCartItems”中的数组

（我不知道这是否有效，因为我在举一个例子。）

因此，有了这个json对象数组，我想在这些值组中按日期以html显示一个表。我使用的实际代码如下：

$.each(ShoppingCart.ShoppingCartItems, function (i, Productos) {
   $(".cart").append("\
   <tr style='background-color: #F1F1F1; border-bottom: 3px solid #fff;'>\
   <td style='width: 10%;'>" + Number(Productos.Quantity) + "</td>\
   <td style='width: 33%'>" + Productos.Name + "</td>\
   <td style='width: 33%'>" + (Productos.Date || 'N/A') + "</td>\
   <td style='width: 20%'>" + Productos.Price + "</td>\
                        </tr>");
 }); //each

我想要的结果是

Qty            Name           Price
May 30, 2014
2             Cake            68
1             Donut           10 (e.g.)
---
May 31, 2014
1             Other product   10.00

我希望产品按日期分组，但我无法从每个产品的json数组中按日期分组，我不知道哪种是bes解决方案，希望有人能帮助我

---

谢谢

看来您的问题与所发现的问题相似

解决办法如下：

首先，分开分组和分组 聚合。让我们声明原型“groupby”函数。需要 为数组元素生成“哈希”字符串的另一个函数

Array.prototype.groupBy = function(hash){   
   var _hash = hash ? hash : function(o){return o;};
   var _map = {};   
   var put = function(map, key, value) {
     if (!map[_hash(key)]) {
       map[_hash(key)] = {};
       map[_hash(key)].group = [];
       map[_hash(key)].key = key;
     }

     map[_hash(key)].group.push(value);    
   }

   this.map(function(obj){
     put(_map, obj, obj);   
   });

   return Object.keys(_map).map(function(key){
       return {key: _map[key].key, 
         group: _map[key].group
       };   
     }); 
};

分组完成后，您可以根据自己的情况按需要聚合数据

data.groupBy(function(o){
  return JSON.stringify({a: o.Phase, b: o.Step});
})
/* aggreagating */
.map(function(el){ 
  var sum = el.group.reduce(function(l,c) {
    return l + parseInt(c.Value);
  }, 0);

  el.key.Value = sum; 
  return el.key;
}); 

一般来说，它是有效的。我已经在Chrome控制台中测试了这段代码，但是可以随意改进并发现错误；）

我想这就是你要找的

这里我有一个分组的实现，它将为您提供一个日期数组。

var ItemsByDate=new Array（）；
$.each（ShoppingCart.ShoppingCartItems，函数（i，Productos）{
var pushNewItem=true；
对于（变量索引=0；索引

我认为您需要做的就是按日期对数组排序，您可以这样实现：

data.ShoppingCartItems.sort(function (a, b) {
  return new Date(a.Date) - new Date(b.Date);
});

在循环数组时，保留对最后一个日期的引用，并且仅在日期不同时将其添加到输出中

---

将有助于更好地解释。

项目是否按该日期排序？感谢您的回复，每个项目都有自己的日期。功能是用户选择一个日期（例如从datepicker），他们选择的每个产品都会有这个日期（例如2014-05-13），在本例中就是今天。感谢您的帮助，我将尝试理解代码，因为作为非英语使用者，理解解释有点困难。正如Derek评论的那样，另一个答案有解决方案，但我将尝试看看我能理解什么。我认为他使用的是下划线.js，出于某些原因，我不能使用它。第三个答案有一个解决方案，它不需要另一个java脚本库来运行。但是，对于您的特定应用程序，可能需要进行一些精细处理。可能有一个更简单的解决方案可以解决您的特定场景。谢谢，作为初学者，我将尝试理解答案。谢谢您的回答，我将尝试一下，但在您使用的小提琴中（我认为它与下面的IE9不兼容，出于各种原因，我需要兼容，但我会尝试一下你的代码。谢谢Andy，你的解决方案（fiddle），我设法使用了$。每个都是出于兼容的原因，并根据我的需要进行了调整，我已经测试过，一切似乎都很好。非常感谢你的fiddle和你的时间。

Array.prototype.groupBy = function(hash){   
   var _hash = hash ? hash : function(o){return o;};
   var _map = {};   
   var put = function(map, key, value) {
     if (!map[_hash(key)]) {
       map[_hash(key)] = {};
       map[_hash(key)].group = [];
       map[_hash(key)].key = key;
     }

     map[_hash(key)].group.push(value);    
   }

   this.map(function(obj){
     put(_map, obj, obj);   
   });

   return Object.keys(_map).map(function(key){
       return {key: _map[key].key, 
         group: _map[key].group
       };   
     }); 
};

data.groupBy(function(o){
  return JSON.stringify({a: o.Phase, b: o.Step});
})
/* aggreagating */
.map(function(el){ 
  var sum = el.group.reduce(function(l,c) {
    return l + parseInt(c.Value);
  }, 0);

  el.key.Value = sum; 
  return el.key;
}); 

var ItemsByDate = new Array();
$.each(ShoppingCart.ShoppingCartItems, function (i, Productos) {
    var pushNewItem = true;
    for (var index = 0; index < ItemsByDate.length; index++)
    {
        dateGroup = ItemsByDate[index];
        if (dateGroup.Date && dateGroup.Date == Productos.Date) {
            dateGroup.Items.push(Productos);
            pushNewItem = false;
        } else {

            pushNewItem = true;
        }
    }
    if (pushNewItem) {
        ItemsByDate.push({
                Date : Productos.Date, Items : [Productos]
            });
    }
});

data.ShoppingCartItems.sort(function (a, b) {
  return new Date(a.Date) - new Date(b.Date);
});