2.8js扁平化数组转成树形数组

        昨天领导给我布置了一个任务,将扁平化数组转换成格式正确的树形数组,这我之前也没搞过啊,就开始胡乱瞎搞一通,经过不懈的努力还是搞出来了。不过今天看到网上有这种算法题,仔细研究了一下,确实牛,我写的是什么牛马。。

        原数组的格式是这样的。

        var data = [
	{  ID: 111 ,code:'1164000',NAME_CHS: '宁夏回族自治区',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0001',PATH_LAYER:1},
	{  ID: 112 ,code:'1164001',NAME_CHS: '宁夏农垦集团',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00010001',PATH_LAYER:2},
	{  ID: 113 ,code:'1164002',NAME_CHS: '宁夏建设投资',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00010002',PATH_LAYER:2},
	{  ID: 1133 ,code:'1164002',NAME_CHS: '宁夏建设投资3级1号',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'000100020001',PATH_LAYER:3},
	{  ID: 1133 ,code:'1164002',NAME_CHS: '宁夏建设投资3级2号',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'000100020002',PATH_LAYER:3},
	{  ID: 114 ,code:'1164003',NAME_CHS: '石家庄',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0002',PATH_LAYER:1},
	{  ID: 115 ,code:'1164004',NAME_CHS: '石家庄最帅集团',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00020001',PATH_LAYER:2},
	{  ID: 116 ,code:'1164003',NAME_CHS: '天津',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0003',PATH_LAYER:1},
	{  ID: 117 ,code:'1164004',NAME_CHS: '天津落户真难',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00030001',PATH_LAYER:2},
	{  ID: 118 ,code:'1164003',NAME_CHS: '北京',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0004',PATH_LAYER:1},
	{  ID: 119 ,code:'1164004',NAME_CHS: '北京房价珍贵',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00040001',PATH_LAYER:2},
	{  ID: 120 ,code:'1164003',NAME_CHS: '内蒙古',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0005',PATH_LAYER:1},
	{  ID: 121 ,code:'1164004',NAME_CHS: '内蒙古大草原可真不错',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00050001',PATH_LAYER:2},	
	{  ID: 122 ,code:'1164003',NAME_CHS: '长沙',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0006',PATH_LAYER:1},
	{  ID: 123 ,code:'1164004',NAME_CHS: '长沙的夜生活确实不错',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00060001',PATH_LAYER:2},	
	{  ID: 124 ,code:'1164003',NAME_CHS: '苏州',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0007',PATH_LAYER:1},
	{  ID: 125 ,code:'1164004',NAME_CHS: '原来苏州的房子也买不起',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00070001',PATH_LAYER:2},	
	{  ID: 124 ,code:'1164003',NAME_CHS: '杭州',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'0008',PATH_LAYER:1},
	{  ID: 125 ,code:'1164004',NAME_CHS: '杭州东额放字',PATHCODE_ISDETAIL:'0',PATHCODE_PATH:'00080001',PATH_LAYER:2},	
];

        要转换成如下格式的代码。

var data1 = [
    {
        title: '江西',id: 1,children: [{title: '南昌',id: 1000,
        children: [{title: '青山湖区',id: 10001}, {title: '高新区',id: 10002}]
	}, 
    {
        title: '九江',id: 1001,children:[]
	}, 
    {
		title: '赣州',id: 1002
	}]
}]

        就是说首先要把里面的ID变成id,NAME_CHS变成title,那么这里用个map方法就可以了。

var dt = data.map(v => {return {id:v.ID,title:v.NAME_CHS,PATHCODE_PATH:v.PATHCODE_PATH,code:v.code,PATHCODE_ISDETAIL:v.PATHCODE_ISDETAIL,PATH_LAYER:v.PATH_LAYER}})

        接下来就开始将这个扁平数组转换成树形数组。

        先来看完整代码。

function Arraytree(data){
	let result = [];//结果数组
	let map = {};   //桥梁对象
	for (const d of data) {
		map[d.PATHCODE_PATH] = {...d,children:[]}   //map是id为key,带children数组的对象为value的对象。
		if (d.PATH_LAYER === 1) {
			let newItem = map[d.PATHCODE_PATH]  //如果级数为1,直接将对应的map中的对象添加到result
			result.push(newItem)
		} else if(d.PATH_LAYER === 2) {
			map[d.PATHCODE_PATH.slice(0,4)].children.push(map[d.PATHCODE_PATH])
		} else if(d.PATH_LAYER === 3 ){
			map[d.PATHCODE_PATH.slice(0,8)].children.push(map[d.PATHCODE_PATH])
		}
	}
	return result
}

        一句一句来分析~

map[d.PATHCODE_PATH] = {...d,children:[]}  这一行给map对象添加了key为PATH,value为原对象+children后的新对象。

         那么就可以进行下一步了,如果我们遍历的那一项(比方说就宁夏回族自治区这一项)它的级数为1,那么我就把map里以这一项的PATHCODE_PATH为key的对象push到我的结果数组result中。可以说是非常牛逼了,用map对象来实现了一个连接级数和path的桥梁。

                if (d.PATH_LAYER === 1) {

                    let newItem = map[d.PATHCODE_PATH] 

                    result.push(newItem)

                }

         但是现在只有1级,2级3级都没进来的,那么我们就继续判断,当遍历项的级数为2时,我们将map中以这项path为key的对象添加到他的父级中,那么怎么找父级呢,因为这个里面子集是在父级的基础上加了4位,所以前4位一样,所以我直接添加到map中以这项的path的前四位为key的数据中。直接完美实现。

                else if(d.PATH_LAYER === 2) {

                    map[d.PATHCODE_PATH.slice(0,4)].children.push(map[d.PATHCODE_PATH])

                }       

        那么同理第三集就是前8位。

                else if(d.PATH_LAYER === 3 ){

                    map[d.PATHCODE_PATH.slice(0,8)].children.push(map[d.PATHCODE_PATH])

                }

        这样我们就可以得到一个符合要求的树形数组了。但是这样的话如果有4级,5级还是需要手动添加和手动更改,这里我们做一个循环,从第二集开始,这样只需要改最大值就行了。

                for(let i=2;i<=3;i++){

                    if(d.PATH_LAYER === i) {

                    map[d.PATHCODE_PATH.slice(0,(i-1)*4)].children.push(map[d.PATHCODE_PATH])

                } }

 

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值