รับอาร์เรย์อ็อบเจ็กต์และแปลง JSON เป็นโครงสร้างต้นไม้ใน JavaScript

ภาพรวม

สมมติว่าเรามีอาร์เรย์ของอ็อบเจ็กต์:

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" }
];

เราต้องเขียนฟังก์ชันที่ใช้การเรียกซ้ำแปลง JSON เป็นโครงสร้างต้นไม้ (Tree-structure)

โครงสร้างต้นไม้ที่คาดหวัง

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" } }
    ]
  }
]