首頁 > web前端 > js教程 > 如何在 JavaScript 中從平面數組高效建構層次樹?

如何在 JavaScript 中從平面數組高效建構層次樹?

Patricia Arquette
發布: 2024-12-10 15:27:14
原創
810 人瀏覽過

How to Efficiently Build a Hierarchical Tree from a Flat Array in JavaScript?

在JavaScript 中從平面數組建立層次樹

在JavaScript 中,在某些情況下您可能需要將平面數組轉換為將表示層次結構的物件轉換為嵌套的樹狀結構。在處理複雜的 JSON 資料時可能會出現這種情況,如提供的範例所示。

為了建構樹狀結構,我們使用基於地圖的方法。該方法高效且支援多個根節點。它要求父節點在平面數組中位於其子節點之前。

以下是我們在 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;
}

var entries = //Your flat array of entries

console.log(list_to_tree(entries));
登入後複製

此解決方案初始化一個映射映射,該映射存儲每個節點的索引ID,確保快速查找。然後它會遍歷列表兩次。在第一遍中,它將每個節點的孩子屬性初始化為空數組。在第二遍中,它透過使用地圖中的資料將節點附加到各自的父節點來建構樹結構。如果節點的parentId 為“0”,則將其視為根節點並添加到根數組中。最後,list_to_tree 函數傳回根節點數組。

以上是如何在 JavaScript 中從平面數組高效建構層次樹?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板