如何解决以分层树结构打印姓氏
有一个包含父子关系的数据对象数组。我想按级别打印树的结构,只打印名称。如果没有指明父节点,则它是根节点。
样本输入:
data = [
{
id: 1,name: "ABC",parent: 2
},{
id: 2,name: "BCA"
},{
id: 3,name: "CBA",parent: 1
},{
id: 4,name: "DDA",{
id: 5,name: "EFG",parent: 2
}
];
输出:
BCA
ABC
CBA
DDA
EFG
我尝试使用reduce来获取对象结构,但无法获取遍历逻辑。有没有更好的方法来获得解决方案,使所有子对象都在一个数组下?
const data = [{ id: 1,parent: 2 },{ id: 2,name: "BCA" },{ id: 3,parent: 1 },{ id: 4,parent: 1 }];
let root = null;
const obj = data.reduce((r,o) => {
Object.assign(r[o.id] = r[o.id] || {},o);
if (!o.parent) {
root = o.id;
}
r[o.parent] = r[o.parent] || {};
r[o.parent][o.id] = r[o.id];
return r;
},{});
console.log(obj[root]);
解决方法
reduce
是正确的操作,因为我们希望构建从每个节点到其子节点的平面映射,然后返回根节点。需要每个节点的 children
数组,以便我们可以自上而下遍历和打印树。如果 parent
引用就足够了,我们就大功告成了,因为原始结构已经有了这些。
产生嵌套结构的一种方法是:
const unflattenTree = data => {
const nodes = {};
let root;
for (const node of data) {
nodes[node.id] = {children: [],...nodes[node.id],...node};
if (node.parent) {
nodes[node.parent] = {children: [],...nodes[node.parent]};
nodes[node.parent].children.push(nodes[node.id]);
}
else {
root = nodes[node.id];
}
}
return root;
};
const printTree = (root,gap=4,level=0) => {
if (root) {
console.log(" ".repeat(level),root.name);
root.children?.forEach(e => printTree(e,gap,level + gap));
}
};
const data = [
{
id: 1,name: "ABC",parent: 2
},{
id: 2,name: "BCA"
},{
id: 3,name: "CBA",parent: 1
},{
id: 4,name: "DDA",{
id: 5,name: "EFG",parent: 2
}
];
printTree(unflattenTree(data));
一种非常简单但效率低下的方法就是扫描父节点与特定 ID 匹配的节点,然后使用它们的 ID 重复查找子节点。
const display = (data,id = null,d = 0) => data
.filter (({parent}) => parent == id)
.map (node => ' ' .repeat (d) + node.name + `\n` +
display (data,node.id,d + 1)) .join('')
const data = [{id: 1,parent: 2},{id: 2,name: "BCA"},{id: 3,parent: 1},{id: 4,{id: 5,parent: 2}];
console .log (display (data))
.as-console-wrapper {max-height: 100% !important; top: 0}
如果你想生成数据结构(不是树,而是森林,因为可能有多个根),就这么简单:
const renest = (data,id = null) => data
.filter (({parent}) => parent == id)
.map ((node) => ({...node,children: renest (data,node.id)}))
const data = [{id: 1,parent: 2}];
console .log (renest (data))
.as-console-wrapper {max-height: 100% !important; top: 0}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。