首頁 > web前端 > js教程 > 如何在 JavaScript 中有效地將平面 JSON 陣列轉換為分層樹結構?

如何在 JavaScript 中有效地將平面 JSON 陣列轉換為分層樹結構?

DDD
發布: 2024-12-14 18:42:11
原創
343 人瀏覽過

How to Efficiently Transform a Flat JSON Array into a Hierarchical Tree Structure in JavaScript?

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

在涉及複雜分層得至關重要,特別是對於表示樹狀結構。本文介紹如何在 JavaScript 中將平面 JSON 陣列轉換為分層樹。

問題

給定一個由具有三個關鍵屬性的物件組成的平面JSON 陣列:

  • id:每個節點的唯一識別碼
  • parentId:節點的識別碼節點的父節點(0表示根節點)
  • level:樹中節點的深度

任務是將這個平面數組轉換為分層樹結構,其中每個父節點封裝其子節點。

解決方案

一種有效的方法利用用於構建樹的地圖查找演算法。此演算法迭代平面數組兩次:

  1. 初始化:建立一個映射,其中每個節點的 id 與其在數組中的索引相關聯。為每個節點初始化子數組。
  2. 樹建構:再次迭代數組,將每個節點的parentId映射到對應的父節點。如果未找到父節點,則目前節點將成為根節點。

實作

以下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") {
      // handle dangling branches here
      list[map[node.parentId]].children.push(node);
    } else {
      roots.push(node);
    }
  }
  return roots;
}
登入後複製

將平面JSON陣列轉換為分層樹結構:

var entries = [
    // ... entries as in the provided example
];

var tree = list_to_tree(entries);

// The resulting `tree` is the hierarchical data structure
登入後複製
結論

本文提出的演算法有效地將平面JSON 陣列轉換為分層結構JavaScript 中的樹結構。它依靠地圖查找方法進行高效構建,使其適合處理複雜的資料集。

以上是如何在 JavaScript 中有效地將平面 JSON 陣列轉換為分層樹結構?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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