数组 ,对象的结合使用

2017-12-02  本文已影响0人  liuguangsen

例子:

a=[{ cata:'宝马', name:'宝马X1' , color:'白色'},

  { cata:'宝马', name:'宝马X2' ,color:'白色'},

  { cata:'奔驰', name:'奔驰X1' ,color:'白色'},

 { cata:'奔驰', name:'奔驰X2',color:'白色'},

  { cata:'奔驰', name:'宝马X3' ,color:'白色'},

  { cata:'奇瑞', name:'奇瑞X1' ,color:'白色'},

  { cata:'奇瑞', name:'奇瑞X2' ,color:'白色'},

 { cata:'大众', name:'大众X1' ,color:'白色'},

 ]

将a数组变为:

b=[ {cate:'宝马', list: [{name:'宝马X1' ,color:'白色'},  {name:'宝马X2' ,color:'白色'}]},

{cate:'奔驰', list: [{name:'奔驰X1' ,color:'白色'},  {name:'奔驰X2' ,color:''},{name:'奔驰X3' ,color:'白色'}]},

{cate:'奇瑞', list: [{name:'奇瑞X1' ,color:'白色'},  {name:'奇瑞X2' ,color:'白色'}]},

{cate:'大众', list: [{name:'大众X1' ,color:'白色'}]},

 ]

实现:

第一步:

var arr=[ ] ;  

for(var i=0; i<a.length; i++){

arr.push(a[i].cata);

}

console.log(arr);

结果:

第二步:

//数组去重 (es6)

var set=new Set(arr);

var arr1=new Array(...set);

console.log(arr1);

结果:

第三步:

var arr2=arr1.map((item)=>{   //箭头函数

return{ cata:item,

           list:[ ]

}

})

console.log(arr2);

结果:

第四步:

for(var n=0;  n<arr2.length;   n++){

           for(var m=0; m<a.length; m++){

                        if(arr2[n].cata==a[m].cata){

                    arr2[n].lis t.push(a[m])

                                                        }                          

                                    }

               }

结果:

这样做法往往用于页面渲染,如果后端直接给你的数据是b数组的形式,那我们就很轻松的用了,就不用像这样处理了,如果 后端直接给你的数据是a数组的形式,那么我们就要这样处理了。

像这样:

上一篇下一篇

猜你喜欢

热点阅读