Cómo JS convierte rápida y eficientemente una matriz en una estructura de árbol
const data = [{
id: 1,
pid: 0,
name: 'body'
}, {
id: 2,
pid: 1,
name: 'title'
}, {
id: 3,
pid: 2,
name: 'div'
}];
转化为这种: [{
id: 1,
pid: 0,
name: 'body',
children: [{
id: 2,
pid: 1,
name: 'title',
children: [{
id: 3,
pid: 1,
name: 'div'
}]
}]
}]
En el código:
function toTree(data) {
// 空数组
let result = [];
// 判断不是数组 直接返回
if (!Array.isArray(data)) {
return result
}
// 遍历 删除 children 属性 做初始化操作
data.forEach(item => {
delete item.children;
});
// 空对象
let map = {
};
data.forEach(item => {
map[item.id] = item;
});
/**
* map对象的 键: 是每个id 值：对应的item
* 1: {
id: 1, pid: 0, name: "body"}
* 2: {
id: 2, pid: 1, name: "title"}
* 3: {
id: 3, pid: 2, name: "div"}
*/
data.forEach(item => {
// item.pid 为0时 返回underfined
let parent = map[item.pid];
if (parent) {
(parent.children || (parent.children = [])).push(item);
} else {
// 这里push的item是pid为0的数据
result.push(item);
}
});
return result;
}
console.log(toTree(data))
¡Eso es!
