js数组通过某个字段进行分组

数据结构

var list = [
            {
                id:0,
                name:"剑圣-刺客",
                type:"刺客"
            },
            {
                id:1,
                name:"安妮-法师",
                type:"法师"
            },
            {
                id:3,
                name:"赵信-战士",
                type:"战士"
            },
            {
                id:4,
                name:"寒冰-射手",
                type:"射手"
            },
            {
                id:4,
                name:"维恩-射手",
                type:"射手"
            },
            {
                id:2,
                name:"蕾欧娜-坦克",
                type:"坦克"
            },
            {
                id:1,
                name:"拉克丝-法师",
                type:"法师"
            },
            {
                id:0,
                name:"劫-刺客",
                type:"刺客"
            },
            {
                id:1,
                name:"凤凰-法师",
                type:"法师"
            },
            {
                id:3,
                name:"皇子-战士",
                type:"战士"
            },
            {
                id:2,
                name:"龙龟-坦克",
                type:"坦克"
            }
        ]

处理之后的数据结构


image.png

方法一,思路,先把要分组的字段提取出来存放在一个数组然后去重,然后在循环分组

function groupArr(list,field){
            var fieldList = [],att=[];
            list.map((e)=>{
                fieldList.push(e[field])
            })
            //数组去重
            fieldList = fieldList.filter((e,i,self)=>{
                return self.indexOf(e)==i
            })
            for(var j=0;j<fieldList.length;j++){
                //过滤出匹配到的数据
                var arr = list.filter((e)=>{
                    return e.id==fieldList[j];
                })
                att.push({
                    type:arr[0].type,
                    list:arr
                })
            }
            return att;
        }

方法2,利用for in 把过滤字段当做属性 ,通过属性去添加到对象里面,最后把对象通过for in 处理为自己需要的结构

function groupArr(list,field){
            var obj = {};
            for(var i=0;i<list.length;i++){
                for(item in list[i]){
                    if(item==field){
                        obj[list[i][item]] = {
                            list:obj[list[i][field]]?obj[list[i][field]].list:[],
                            type:list[i].type
                        };
                    }
                }
                obj[list[i][field]].list.push(list[i])
            }
            var att = [];
            for(item in obj){
                att.push({
                    list:obj[item].list,
                    type:obj[item].type,
                })
            }
            return att;
        }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,144评论 1 32
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,337评论 0 3
  • 在长满水草的池塘里,两只鸭子,一只向左,一只向右 路两边高高的野花,有红,有紫,有粉,有白 在我路过的,第五个水洼...
    池光阅读 252评论 0 2
  • 第1109天~ 第1110天~ 一个有英文名的皇帝~ 第1111天
    咖菲菲阅读 445评论 1 0
  • 【侯红星日精进打卡第012天】 【知~学习】 《六项精进》大纲1遍 ,共12遍; 《大学》开篇1遍,共21遍; 《...
    恒者星也阅读 100评论 0 0