javascript生成一棵树

问题描述

输入一串父子节点对的数组，利用其构造一颗树

输入

const arr = [
    {id:1,parentid:null},
    {id:2,parentid:1},
    {id:3,parentid:1},
    {id:4,parentid:2},
    {id:5,parentid:3}
]

解决思路

1. 明确输出的形式：

   type1: {id:0,chid:[{id,child},{id,child},{id,child}]}

   type2: 0:{1:{5:{}},2:{},3:{},4:{}}

   实践中type1更为实用，故选择之

2. 每次只能处理一对父子关系，树形结构的核心是节点，也即处理两个节点。

   由于每个节点的状态是需要维护的，因此需要用一种结构存储每个节点并更新之，最后程序只需要找到根节点是谁即可输出完整的属性结构；

解决代码

const arr = [
    {id:1,parentid:null},
    {id:2,parentid:1},
    {id:3,parentid:1},
    {id:4,parentid:2},
    {id:5,parentid:3}
]

function generateTree(srcList){
    // 1. 明确输出的形式：
    // type1:{id:0,chid:[{id,child},{id,child},{id,child}]}
    // type2: 0:{1:{5:{}},2:{},3:{},4:{}}
    // 实践中type1更为实用，故选择之
    // 2. 每次只能处理一对父子关系，树形结构的核心是节点，也即处理两个节点。
    // 由于每个节点的状态是需要维护的，因此需要用一种结构存储每个节点并更新之，最后程序只需要找到根节点是谁即可输出完整的属性结构；
    let nodeRigister = {}
    let root = undefined
    srcList.forEach(element => {
        let childId = element.id
        let parentId = element.parentid
        // parentId可能引入新的信息：判断是否为根节点。需要特判之
        if(!parentId){
            root = childId
        } 
        // 处理儿子节点
        if(!(childId in Object.keys(nodeRigister))){
            nodeRigister[childId] = {id:childId,child:[]}
        }
        // 处理父节点
        if(parentId && parentId in Object.keys(nodeRigister)){
            nodeRigister[parentId].child.push(nodeRigister[childId])
        }else if(parentId){
            nodeRigister[parentId] = {id:parentId,child:[nodeRigister[childId]]}
        }
    });
    return nodeRigister[root]
}
generateTree(arr)

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://shenqiku.cn/article/FLY_11417