如何基于普通对象创建嵌套数组
我有一个以以下格式输出数据的端点:
const result = [
{id: 4, parentId: null, name: 'Fruits & Veggies'},
{id: 12, parentId: 133, name: 'Sanguinello'},
{id: 3, parentId: 4, name: 'Fruits'},
{id: 67, parentId: 98, name: 'Sesame'},
{id: 23, parentId: 3, name: 'Orange'},
{id: 7, parentId: null, name: 'Grains'},
{id: 134, parentId: 7, name: 'Flour'},
{id: 3512, parentId: 23, name: 'Navel Orange'},
{id: 98, parentId: null, name: 'Seeds'},
{id: 4122, parentId: 58, name: 'Lamb'},
{id: 133, parentId: 23, name: 'Blood Orange'},
];
我需要创建一个递归函数来获取一个潜在的无限嵌套对象,该对象的格式如下:
const infiniteTreeOutput = {
children: [
{ label: 'Fruits & Veggies', id: 4, children: [
{ label: 'Fruits', id: 3, children: [
{ label: 'Orange', id: 23, children: [
{ label: 'Navel Orange', id: 3512 },
{ label: 'Blood Orange', id: 133, children: [
{ label: 'Sanguinello', id: 12 }
]
}
]
}
]
}
]
},
{ label: 'Grains', id: 7 },
{ label: 'Seeds', id: 98, children: [
{ label: 'Sesame', id: 67 }
]
}
]
};
所以:
- 如果 parentId 为 null,则它们位于顶层(水果和蔬菜、谷物、种子)。
- 如果给定节点没有子节点,则它根本不应该具有该属性。
- 如果存在孤立数据(例如这里没有父级的“Lamb”,那么我们应该忽略该对象)。
我有一个糟糕的工作功能,但我很想知道是否有可能有一个递归解决方案。
回答
您可以采用不带递归的简单单循环方法,但使用一个对象来保留所有节点。
const
data = [{ id: 4, parentId: null, name: 'Fruits & Veggies' }, { id: 12, parentId: 133, name: 'Sanguinello' }, { id: 3, parentId: 4, name: 'Fruits' }, { id: 67, parentId: 98, name: 'Sesame' }, { id: 23, parentId: 3, name: 'Orange' }, { id: 7, parentId: null, name: 'Grains' }, { id: 134, parentId: 7, name: 'Flour' }, { id: 3512, parentId: 23, name: 'Navel Orange' }, { id: 98, parentId: null, name: 'Seeds' }, { id: 133, parentId: 23, name: 'Blood Orange' }],
tree = function (data, root) {
var t = {};
data.forEach(({ id, parentId, name: label }) => {
Object.assign(t[id] = t[id] || {}, { label, id });
((t[parentId] ??= { label: '', id: null, }).children ??= []).push(t[id]);
});
return t[root].children;
}(data, null);
console.log(tree);
.as-console-wrapper { max-height: 100% !important; top: 0; }