Skip to content
Menu
Yuuk的博客
  • 首页
  • 前端技术
    • JavaScript
    • HTML & CSS
  • SEO
  • 设计
    • 素材分享
    • 设计教程
  • 随笔
Yuuk的博客

JS根据某个共同字段将数据分组

Posted on 2018年4月25日 by yuuk

数据源如下:

var arr = [{
    "categoryId":123456,
    "parentId":2010105,
    "name":"Web解决方案"
},{
    "categoryId":2010106,
    "parentId":2010105,
    "name":"IT解决方案"
},{
    "categoryId":2010118,
    "parentId":2010105,
    "name":"行业解决方案"
}]

函数定义:

/**
 * [groupingData 根据共同字段将数据分组]
 * @param {[type]} arr [数据源]
 * @param {[type]} field [字段名]
 */
const groupingData = (data, filed) => {
    let map = {};
    let dest = [];
    data.forEach(item => {
        if(!map[item[filed]]) {
            dest.push({
                [filed]: item[filed],
                list: [item]
            });
            map[item[filed]] = item;
        } else {
            dest.forEach(dItem => {
                if (dItem[filed] == item[filed]) {
                    dItem.list.push(item);
                }
            });
        }
    })
    return dest;
}

根据数据源可以发现,这里的共同字段是 parentId

let res = groupingData(arr, 'parentId');
console.warn(res);

打印出结果即:

[
    {
        "parentId":2010105,
        "list":[
            {
                "categoryId":123456,
                "parentId":2010105,
                "name":"Web解决方案"
            },
            {
                "categoryId":2010106,
                "parentId":2010105,
                "name":"IT解决方案"
            },
            {
                "categoryId":2010118,
                "parentId":2010105,
                "name":"行业解决方案"
            }
        ]
    }
]
打赏赞(1)分享

发表回复 取消回复

您的邮箱地址不会被公开。 必填项已用 * 标注

搜索

近期文章

  • 宝塔面板中使用docker部署nodejs应用
  • 如何将docker镜像上传到阿里云
  • React Native 报错 No bundle URL present 解决方法
  • axios 给每一个请求添加耗时统计
  • css filter属性导致fixed失效

标签

addEventListener ajax ajax跨域 chatAt css居中 DNS缓存 docker gulp ie7 json jsonp margin memcache mysql nodejs ps技巧 typescript void vpn vuejs wampserver webpack win10 XMLHttpRequest z-index 事件冒泡 事件绑定 内容发布时间 图片加载 大写 字符串 封装ajax 广告屏蔽 批量修改图层名称 水平垂直居中 注册码 特殊符号 百度 空元素 站长平台 网页快照 负边界 递减 随机数 首字母

友情链接

  • 蔡甸新闻网
©2025 Yuuk的博客 | 鄂ICP备13014750号-9