js 实现 list转换成tree(数组到树)

目标:

JS 将有父子关系的平行数组转换成树形数据

方法一:双重遍历,一次遍历parentId,一次遍历id == parendId;

该方法应该能很容易被想到,实现起来也一步一步可以摸索出来;

const oldData = [
    {id:1,name:'boss',parentId:0},
    {id:2,name:'lily',parentId:1},
    {id:3,name:'jack',parentId:1},
    {id:4,name:'john',parentId:2},
    {id:5,name:'boss2',parentId:0},
]


function listToTree(oldArr){
    oldArr.forEach(element => {
        let parentId = element.parentId;
        if(parentId !== 0){
            oldArr.forEach(ele => {
                if(ele.id == parentId){ //当内层循环的ID== 外层循环的parendId时,(说明有children),需要往该内层id里建个children并push对应的数组;
                    if(!ele.children){
                        ele.children = [];
                    }
                    ele.children.push(element);
                }
            });
        }
    });
    console.log(oldArr)  //此时的数组是在原基础上补充了children;
    oldArr = oldArr.filter(ele => ele.parentId === 0); //这一步是过滤,按树展开,将多余的数组剔除;
    console.log(oldArr)
    return oldArr;
}
listToTree(oldData);

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 猛然看到这消息,居然没回过神来,金老爷子居然走了…… 飞雪连天射白鹿,笑书神侠倚碧鸳。当年武侠情结...
    左左小白阅读 4,010评论 0 0
  • 从小被人称为胖女女,记忆中没有什么东西,觉得不好吃,吃不下去。除了糊了焦了的东西。见过很多瘦人也是食量大如牛。自己...
    妩媚思丝阅读 1,747评论 0 2
  • 标题:手撕图形 ️日期:2019.3.12 ️所用道具:A4纸 内容:让孩子自己动手,撕出各种图形,再进行拼搭
    ll冰儿阅读 3,203评论 0 0
  • 今天看完了一本独特的“童话故事”——《小狗钱钱》,副标题是“引导孩子正确认识财富,创造财富的金钱童话”。本书开创了...
    仁宗阅读 4,021评论 0 3

友情链接更多精彩内容