如何在 JavaScript 中有效地將分層資料的平面數組轉換為嵌套樹結構？

在JavaScript 中從平面數組資料建立樹結構

處理複雜的分層資料時，有必要將其組織成樹-類似於分析和演示的結構。在本例中，有序 JSON 檔案包含數據，每個條目都有 id、parentId、層級和文字。任務是將這種平面資料結構轉換為嵌套層次結構。

為了有效地實現這種轉換，利用地圖查找策略非常重要。這涉及創建一個映射，將每個 id 映射到其在列表中的索引。透過利用此映射，可以一次建立嵌套層次結構，從而無需多次循環。

以下JavaScript 函數示範了建構樹結構的映射查找方法：

function list_to_tree(list) {
  var map = {}, node, roots = [], i;
  
  for (i = 0; i < list.length; i += 1) {
    map[list[i].id] = i; // initialize the map
    list[i].children = []; // initialize the children
  }
  
  for (i = 0; i < list.length; i += 1) {
    node = list[i];
    if (node.parentId !== "0") {
      // if you have dangling branches check that map[node.parentId] exists
      list[map[node.parentId]].children.push(node);
    } else {
      roots.push(node);
    }
  }
  return roots;
}

透過建立一個映射來快速存取父節點並初始化每個節點的子列表，該函數可以有效地合併兩個for 迴圈。此方法支援多個根，並且可以處理懸掛分支或透過簡單的修改忽略它們。

要示範該函數的功能，您可以使用以下輸入執行它：

var entries = [{
    "id": "12",
    "parentId": "0",
    "text": "Man",
    "level": "1",
    "children": null
  },
  {
    "id": "6",
    "parentId": "12",
    "text": "Boy",
    "level": "2",
    "children": null
  },
  {
    "id": "7",
    "parentId": "12",
    "text": "Other",
    "level": "2",
    "children": null
  },
  {
    "id": "9",
    "parentId": "0",
    "text": "Woman",
    "level": "1",
    "children": null
  },
  {
    "id": "11",
    "parentId": "9",
    "text": "Girl",
    "level": "2",
    "children": null
  }
];

console.log(list_to_tree(entries));

這將輸出具有節點之間預期關係的分層樹結構。透過利用地圖尋找策略，這種方法提供了一種高效靈活的解決方案，用於將平面分層資料轉換為結構良好的樹形數組。

以上是如何在 JavaScript 中有效地將分層資料的平面數組轉換為嵌套樹結構？的詳細內容。更多資訊請關注PHP中文網其他相關文章！