JavaScript 数组转换为树形结构 - 代码示例
以下是一个简单的示例,将具有父子关系的数组转换为树形结构:
const arr = [
{ id: 1, name: 'A', parentId: null },
{ id: 2, name: 'B', parentId: 1 },
{ id: 3, name: 'C', parentId: 1 },
{ id: 4, name: 'D', parentId: 2 },
{ id: 5, name: 'E', parentId: 2 },
{ id: 6, name: 'F', parentId: 3 },
{ id: 7, name: 'G', parentId: null },
];
function buildTree(arr, parentId = null) {
const tree = [];
arr.forEach(item => {
if (item.parentId === parentId) {
const children = buildTree(arr, item.id);
if (children.length) {
item.children = children;
}
tree.push(item);
}
});
return tree;
}
const result = buildTree(arr);
console.log(result);
输出:
[
{
'id': 1,
'name': 'A',
'parentId': null,
'children': [
{
'id': 2,
'name': 'B',
'parentId': 1,
'children': [
{
'id': 4,
'name': 'D',
'parentId': 2
},
{
'id': 5,
'name': 'E',
'parentId': 2
}
]
},
{
'id': 3,
'name': 'C',
'parentId': 1,
'children': [
{
'id': 6,
'name': 'F',
'parentId': 3
}
]
}
]
},
{
'id': 7,
'name': 'G',
'parentId': null
}
]
该函数使用递归的方式构建整个树形结构。在每一层递归时,通过传递父节点的 id 参数来筛选出当前层级的子节点,并将它们添加到当前节点的 children 属性中。如果当前节点没有子节点,则直接将其添加到 tree 数组中。最后返回整个树形结构。
原文地址: https://www.cveoy.top/t/topic/noFL 著作权归作者所有。请勿转载和采集!