如何最好地将 JSON 子数据对象数组重构为父数组



我们有一些JSON数据,其中每个父数组对象都可以有一个属性,该属性是"子"数组

,如下所示:
data: [
{
value: 1,
parent_id: null,
label: "1.0 - TT One",
children: [
{
value: 3,
label: "1.1 - TT One-One",
parent_id: 1,
},
{
value: 4,
label: "1.2 - TT One-Two",
parent_id: 1,
}
]
},
{
value: 2,
parent_id: null,
label: "2.0 - TT Two",
children: [
{
value: 5,
label: "2.1 - TT Two-One",
parent_id: 2,
}
]
}
]

我们想"扁平化"子项,以便我们最终得到一个数组,该数组是所有父项和子项,如下所示(如果效率不高,则不必保持命名数据(:

data: [
{  
value: 1,
parent_id: null,
label: "1.0 - TT One"
},
{  <-- FORMER CHILD
value: 3,
label: "1.1 - TT One-One",
parent_id: 1
},
{  <-- FORMER CHILD
value: 4,
label: "1.2 - TT One-Two",
parent_id: 1,
},
{
value: 2,
parent_id: null,
label: "2.0 - TT Two"
},
{  <-- FORMER CHILD
value: 5,
label: "2.1 - TT Two-One",
parent_id: 2,
}
]  

关于如何在高效的庄园中最好地实现这一目标的想法?我们已经强调这是否会有所帮助。

发现数组到数组扁平化和一些对象到数组扁平化,但没有将两者结合起来。如果我们有这个,我们就不需要发布。如果从我们所拥有的确切到我们需要的并不明显,那有什么意义呢?

关键是要了解您的数据结构是什么以及如何访问该数据结构的每个元素。

由于只有 2 个级别,您甚至不需要找到通用解决方案将初始数据转换为数组。您知道如何遍历数组吗?然后,您就知道如何遍历具有数组作为属性的元素。

无论如何,这里既是递归的,也是非递归的广义解决方案。

var d = [{
value: 1,
parent_id: null,
label: "1.0 - TT One",
children: [{
value: 3,
label: "1.1 - TT One-One",
parent_id: 1,
},
{
value: 4,
label: "1.2 - TT One-Two",
parent_id: 1,
}
]
},
{
value: 2,
parent_id: null,
label: "2.0 - TT Two",
children: [{
value: 5,
label: "2.1 - TT Two-One",
parent_id: 2,
}]
}
];
function walkRecursive(data) {
let result = []
data.forEach(element => {
let e = { ...element}
result.push(e);
if (e.children) {
let children = walkRecursive(e.children)
result = result.concat(children)
delete e.children
}
});
return result;
}
function walk(data) {
data = data.slice()
let result = []
let d, oldData;
while (d = data.shift()) {
let el = { ...d}
result.push(el)
if (el.children) {
oldData = data
data = el.children.slice();
delete el.children;
} else {
if (oldData && data.length == 0) {
data = oldData
oldData = null;
}
}
}
return result;
}
console.log(walkRecursive(d))
console.log(walk(d))

https://codeburst.io/learn-and-understand-recursion-in-javascript-b588218e87ea

最新更新