js数组按对象属性分组

2017-06-22 | 5,861浏览 | 0评论 | 标签:无

object-group.jpg

最近接到这样的需求,常见的快递查询功能,要求按照日期分组。接口返回数据却是这样的:

var list = [{
    time: "2017-6-22 15:00:00",
    addr: "快件正在派送中..."
}, {
    time: "2017-6-22 14:10:10",
    addr: "快件到达[成都]"
}, {
    time: "2017-6-22 16:00:20",
    addr: "快件离开[北京]已发往[成都]"
}, {
    time: "2017-6-20 05:20:00",
    addr: "[北京]十里河中通已收件"
}]

如我所料,数据都揉在一个数组里。没办法,只好重新构造一下数据结构,目标结构是这样的(以日期为key):

var list = {
   "2017-6-22": [{
       "time": "2017-6-22 16:00:20",
       "addr": "快件离开[北京]已发往[成都]"
   }, {
       "time": "2017-6-22 15:00:00",
       "addr": "快件正在派送中..."
   }, {
       "time": "2017-6-22 14:10:10",
       "addr": "快件到达[成都]"
   }],
   "2017-6-20": [{
       "time": "2017-6-20 05:20:00",
       "addr": "[北京]十里河中通已收件"
   }]
}

实现思路比较简单:

  • 1.将原数组list按照日期进行降序(或升序)排序;
  • 2.新建一个以日期为key的空对象obj,用于存储新数据;
  • 3.遍历list,并与新对象obj进行对比。如果obj没有此key,则添加此key,值为空[]; 如果已有此key,则将值push到[]中。

demo:

<script>
var list = [{
    time: "2017-6-22 15:00:00",
    addr: "快件正在派送中..."
}, {
    time: "2017-6-22 14:10:10",
    addr: "快件到达[成都]"
}, {
    time: "2017-6-22 16:00:20",
    addr: "快件离开[北京]已发往[成都]"
}, {
    time: "2017-6-20 05:20:00",
    addr: "[北京]十里河中通已收件"
}]

function sortBy(arr, k, rev) {
    var rev = rev ? 1 : -1;
    return arr.sort(function(a, b) {
        var v1 = !isNaN(Number(a[k]))?Number(a[k]):a[k];
        var v2 = !isNaN(Number(b[k]))?Number(b[k]):b[k];
        if (v1 < v2) {
            return -rev
        } else if (v1 > v2) {
            return rev
        } else {
            return 0
        }
    })
}

//以time属性
var list=sortBy(list,'time')

//对比生成最终数据
var obj = {}
for (var i = 0; i < list.length; i++) {
    var t = new Date(Date.parse(list[i].time.replace(/-/g, "/")));
    var key = t.getFullYear() + '-' + (t.getMonth() + 1) + '-' + t.getDate();
    if (!obj[key]) {
        var temp = [];
        temp.push(list[i]);
        obj[key] = temp;
    } else {
        obj[key].push(list[i])
    }
}

//打印结果
for(var i in obj){
    document.write(i+"<br>");
    for(var j in obj[i]){
        document.write(JSON.stringify(obj[i][j])+"<br>");
    }
    document.write("<br>");
}
</script>
(本篇完。有疑问欢迎留言探讨)

留言:

*

* (方便回复通知)

打赏
编辑代码 运行结果
退出