JavaScript 对象数组转换为嵌套对象:树形结构转换算法
JavaScript 对象数组转换为嵌套对象:树形结构转换算法
本文将介绍如何将一个包含 'parentId' 属性的 JavaScript 对象数组转换为嵌套对象(树形结构)。
原数组
[
{id: 1, name: 'a', parentId: null},
{id: 2, name: 'b', parentId: 1},
{id: 3, name: 'c', parentId: 2},
{id: 4, name: 'd', parentId: 1},
{id: 5, name: 'e', parentId: 4},
{id: 6, name: 'f', parentId: 2},
{id: 7, name: 'g', parentId: null},
{id: 8, name: 'h', parentId: 7},
{id: 9, name: 'i', parentId: 8}
]
转换后的对象嵌套
[
{
id: 1,
name: 'a',
parentId: null,
children: [
{
id: 2,
name: 'b',
parentId: 1,
children: [
{
id: 3,
name: 'c',
parentId: 2,
children: []
},
{
id: 6,
name: 'f',
parentId: 2,
children: []
}
]
},
{
id: 4,
name: 'd',
parentId: 1,
children: [
{
id: 5,
name: 'e',
parentId: 4,
children: []
}
]
}
]
},
{
id: 7,
name: 'g',
parentId: null,
children: [
{
id: 8,
name: 'h',
parentId: 7,
children: [
{
id: 9,
name: 'i',
parentId: 8,
children: []
}
]
}
]
}
]
代码实现
function treeify(arr) {
const result = [];
const map = {};
// 将数组转换为 map,方便查找
arr.forEach(item => {
map[item.id] = item;
});
// 遍历数组,构建树形结构
arr.forEach(item => {
if (item.parentId === null) {
result.push(item);
} else {
if (!map[item.parentId].children) {
map[item.parentId].children = [];
}
map[item.parentId].children.push(item);
}
});
return result;
}
// 使用示例
const data = [
{id: 1, name: 'a', parentId: null},
{id: 2, name: 'b', parentId: 1},
{id: 3, name: 'c', parentId: 2},
{id: 4, name: 'd', parentId: 1},
{id: 5, name: 'e', parentId: 4},
{id: 6, name: 'f', parentId: 2},
{id: 7, name: 'g', parentId: null},
{id: 8, name: 'h', parentId: 7},
{id: 9, name: 'i', parentId: 8}
];
const tree = treeify(data);
console.log(tree);
总结
本文介绍了如何将一个包含 'parentId' 属性的 JavaScript 对象数组转换为嵌套对象(树形结构)。该算法通过创建 map 来快速查找父节点,并遍历数组构建树形结构。希望本文对你有所帮助。
原文地址: https://www.cveoy.top/t/topic/l5BR 著作权归作者所有。请勿转载和采集!