如何循环遍历 Javascript 对象数组，将对象指定为其中其他对象的子对象？ 树/层次结构
[英]How can I loop through a Javascript object array assigning objects as children of other objects within? Tree/hierarchical structure
问题描述
I need help looping through the following object array to reorganize everything into a hierarchy/tree.
我需要帮助遍历以下对象数组以将所有内容重新组织为层次结构/树。 How do I achieve this?我如何实现这一目标？ Any help is appreciated.任何帮助表示赞赏。
[
{
"id":1,
"parentId":null,
"value":"Root Parent 01",
"children":[]
},
{
"id":8,
"parentId":null,
"value":"Root Parent 02",
"children":[]
},
{
"id":36,
"parentId":15,
"value":"Child 01",
"children":[]
},
{
"id":43,
"parentId":15,
"value":"Child 02",
"children":[]
},
{
"id":50,
"parentId":15,
"value":"Child 03",
"children":[]
},
{
"id":15,
"parentId":null,
"value":"Root Parent 03",
"children":[]
},
{
"id":57,
"parentId":22,
"value":"Child 04",
"children":[]
},
{
"id":64,
"parentId":22,
"value":"Child 05",
"children":[]
},
{
"id":71,
"parentId":22,
"value":"Child 06",
"children":[]
},
{
"id":78,
"parentId":22,
"value":"Child 07",
"children":[]
},
{
"id":85,
"parentId":22,
"value":"Child 08",
"children":[]
},
{
"id":92,
"parentId":22,
"value":"Child 09",
"children":[]
},
{
"id":99,
"parentId":22,
"value":"Child 10",
"children":[]
},
{
"id":106,
"parentId":22,
"value":"Child 11",
"children":[]
},
{
"id":22,
"parentId":null,
"value":"Root Parent 04",
"children":[]
},
{
"id":113,
"parentId":29,
"value":"Child 12",
"children":[]
},
{
"id":115,
"parentId":29,
"value":"Child 13",
"children":[]
},
{
"id":122,
"parentId":29,
"value":"Child 14",
"children":[]
},
{
"id":129,
"parentId":29,
"value":"Child 15",
"children":[]
},
{
"id":136,
"parentId":29,
"value":"Child 16",
"children":[]
},
{
"id":143,
"parentId":29,
"value":"Child 17",
"children":[]
},
{
"id":157,
"parentId":150,
"value":"Child 18",
"children":[]
},
{
"id":150,
"parentId":29,
"value":"Child 19",
"children":[]
},
{
"id":29,
"parentId":null,
"value":"Root Parent 05",
"children":[]
}
]
Desired object array:所需的对象数组：
[
{
"id":1,
"parentId":null,
"value":"Root Parent 01",
"children":[]
},
{
"id":8,
"parentId":null,
"value":"Root Parent 02",
"children":[]
},
{
"id":15,
"parentId":null,
"value":"Root Parent 03",
"children":[
{
"id":36,
"parentId":15,
"value":"Child 01",
"children":[]
},
{
"id":43,
"parentId":15,
"value":"Child 02",
"children":[]
},
{
"id":50,
"parentId":15,
"value":"Child 03",
"children":[]
}
]
},
{
"id":22,
"parentId":null,
"value":"Root Parent 04",
"children":[
{
"id":57,
"parentId":22,
"value":"Child 04",
"children":[]
},
{
"id":64,
"parentId":22,
"value":"Child 05",
"children":[]
},
{
"id":71,
"parentId":22,
"value":"Child 06",
"children":[]
},
{
"id":78,
"parentId":22,
"value":"Child 07",
"children":[]
},
{
"id":85,
"parentId":22,
"value":"Child 08",
"children":[]
},
{
"id":92,
"parentId":22,
"value":"Child 09",
"children":[]
},
{
"id":99,
"parentId":22,
"value":"Child 10",
"children":[]
},
{
"id":106,
"parentId":22,
"value":"Child 11",
"children":[]
}
]
},
{
"id":29,
"parentId":null,
"value":"Root Parent 05",
"children":[
{
"id":113,
"parentId":29,
"value":"Child 12",
"children":[]
},
{
"id":115,
"parentId":29,
"value":"Child 13",
"children":[]
},
{
"id":122,
"parentId":29,
"value":"Child 14",
"children":[]
},
{
"id":129,
"parentId":29,
"value":"Child 15",
"children":[]
},
{
"id":136,
"parentId":29,
"value":"Child 16",
"children":[]
},
{
"id":143,
"parentId":29,
"value":"Child 17",
"children":[]
},
{
"id":150,
"parentId":29,
"value":"Child 19",
"children":[
{
"id":157,
"parentId":150,
"value":"Child 18",
"children":[]
}
]
}
]
}
]
Desired Tree:所需树：
Root Parent 01根父级 01
Root Parent 02根父级 02
Root Parent 03根父级 03
---Child 01 ---孩子01
---Child 02 ---孩子02
---Child 03 ---孩子03
Root Parent 04根父级 04
---Child 04 ---孩子04
---Child 05 ---孩子05
---Child 06 ---孩子06
---Child 07 ---孩子07
---Child 08 ---孩子08
---Child 09 ---孩子09
---Child 10 ---孩子10
---Child 11 ---孩子11
Root Parent 05根父级 05
---Child 12 ---孩子12
---Child 13 ---孩子13
---Child 14 ---孩子14
---Child 15 ---孩子15
---Child 16 ---孩子16
---Child 17 ---孩子17
---Child 19 ---孩子19
------Child 18 ------18岁的孩子
1 个解决方案
解决方案1
1 2018-02-22 22:25:16
While I am a huge fan of trying to attempt this yourself.虽然我是尝试自己尝试的超级粉丝。 I have always wondered how to do this as well, and figured it would be a good opportunity for me too.我也一直想知道如何做到这一点，并认为这对我来说也是一个很好的机会。
First I sort the input list looking for items that are for sure a child element and not at all a parent.首先，我对输入列表进行排序，以查找确定为子元素而不是父元素的项目。
Then in the second loop we look for the parent that the child belongs to, and we match them up.然后在第二个循环中，我们查找孩子所属的父级，并将它们进行匹配。 You will probably have to refine this process depending on your data.您可能需要根据您的数据优化此过程。 You might also need to loop multiple times, but this should give you enough to make a dent.您可能还需要多次循环，但这应该足以让您有所收获。
var inputArray = [{ "id": 1, "parentId": null, "value": "Root Parent 01", "children": [] }, { "id": 8, "parentId": null, "value": "Root Parent 02", "children": [] }, { "id": 36, "parentId": 15, "value": "Child 01", "children": [] }, { "id": 43, "parentId": 15, "value": "Child 02", "children": [] }, { "id": 50, "parentId": 15, "value": "Child 03", "children": [] }, { "id": 15, "parentId": null, "value": "Root Parent 03", "children": [] }, { "id": 57, "parentId": 22, "value": "Child 04", "children": [] }, { "id": 64, "parentId": 22, "value": "Child 05", "children": [] }, { "id": 71, "parentId": 22, "value": "Child 06", "children": [] }, { "id": 78, "parentId": 22, "value": "Child 07", "children": [] }, { "id": 85, "parentId": 22, "value": "Child 08", "children": [] }, { "id": 92, "parentId": 22, "value": "Child 09", "children": [] }, { "id": 99, "parentId": 22, "value": "Child 10", "children": [] }, { "id": 106, "parentId": 22, "value": "Child 11", "children": [] }, { "id": 22, "parentId": null, "value": "Root Parent 04", "children": [] }, { "id": 113, "parentId": 29, "value": "Child 12", "children": [] }, { "id": 115, "parentId": 29, "value": "Child 13", "children": [] }, { "id": 122, "parentId": 29, "value": "Child 14", "children": [] }, { "id": 129, "parentId": 29, "value": "Child 15", "children": [] }, { "id": 136, "parentId": 29, "value": "Child 16", "children": [] }, { "id": 143, "parentId": 29, "value": "Child 17", "children": [] }, { "id": 157, "parentId": 150, "value": "Child 18", "children": [] }, { "id": 150, "parentId": 29, "value": "Child 19", "children": [] }, { "id": 29, "parentId": null, "value": "Root Parent 05", "children": [] } ] function DataRollUp(input) { var hasParent = []; var output = [] for (i of input) { if (i.parentId) { hasParent.push(i); } else { output.push(i); } } for (i of hasParent) { var parent = output.find(record => record.id == i.parentId) if (parent) { parent.children.push(i); } } console.log(output); return output; } DataRollUp(inputArray)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.