1. 递归调用
2. 利用 Map对象特性 + 循环
interface Node {
id: number;
name: string;
pid: number;
children?: Array<Node>
}
const arrayToTree = (data: Array<Node>): Node[] => {
const map = new Map();
const result = [];
data.forEach(item => map.set(item.id, { ...item, children: [] }));
map.forEach(item => {
if(map.has(item.pid)) {
const parentNode = map.get(item.pid);
parentNode.children.push(item);
} else {
result.push(map.get(item.id))
}
})
return result;
}
const data = [
{ id: 1, name: "电脑", pid: 0 },
{ id: 2, name: "mac", pid: 1 },
{ id: 3, name: "mac 笔记本", pid: 2 },
{ id: 4, name: "mac 台式机", pid: 2 },
{ id: 5, name: "mac air", pid: 3 },
{ id: 6, name: "mac pro", pid: 3 },
{ id: 7, name: "win", pid: 1 },
{ id: 8, name: "win 笔记本", pid: 7 },
];
const result = arrayToTree(data);
console.log(result);
运行的 tree 结果:

附上生成的 map结构:
