資料結構
網路
RDBMS
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究取一個物件陣列並用 JavaScript 把以上 JSON 轉換成一個樹狀結構
假設，我們有一個這樣的物件陣列 −
const arr = [
{
"parentIndex": '0' ,
"childIndex": '3' ,
"parent": "ROOT",
"child": "root3"
},
{
"parentIndex": '3' ,
"childIndex": '2' ,
"parent": "root3" ,
"child": "root2"
},
{
"parentIndex": '3' ,
"childIndex": '1' ,
"parent": "root3" ,
"child": "root1"
}
];我們需要編寫一個 JavaScript 函式來讀取一個這樣的物件陣列。然後，函式應該使用遞歸併把上述 JSON 轉換成一個樹狀結構。
樹狀結構看起來像 −
nodeStructure: {
text: { name: "root3" },
children: [
{
text: { name: "root2" }
},
{
text: { name: "root1" }
}
]
}
};示例
程式碼如下 −
const arr = [
{
"parentIndex": '0' ,
"childIndex": '3' ,
"parent": "ROOT",
"child": "root3"
},
{
"parentIndex": '3' ,
"childIndex": '2' ,
"parent": "root3" ,
"child": "root2"
},
{
"parentIndex": '3' ,
"childIndex": '1' ,
"parent": "root3" ,
"child": "root1"
}
];
const partial = (arr = [], condition) => {
const result = [];
for (let i = 0; i < arr.length; i++) {
if(condition(arr[i])){
result.push(arr[i]);
}
}
return result;
}
const findNodes = (parentKey,items) => {
let subItems = partial(items, n => n.parent === parentKey);
const result = [];
for (let i = 0; i < subItems.length; i++) {
let subItem = subItems[i];
let resultItem = {
text: {name:subItem.child}
};
let kids = findNodes(subItem.child , items);
if(kids.length){
resultItem.children = kids;
}
result.push(resultItem);
}
return result;
}
console.log(JSON.stringify(findNodes('ROOT', arr), undefined, 4));輸出
控制檯中的輸出如下 −
[
{
"text": {
"name": "root3"
},
"children": [
{
"text": {
"name": "root2"
}
},
{
"text": {
"name": "root1"
}
}
]
}
]
更新於: 20-Nov-2020
1 千次以上檢視
廣告