如何在 JavaScript 中有效地将平面 JSON 数组转换为分层树结构？-js教程-PHP中文网

如何在 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 数组构建层次树数据结构

在涉及复杂 JSON 数据的场景中，分层组织它变得至关重要，特别是对于表示树状结构。本文介绍如何在 JavaScript 中将平面 JSON 数组转换为分层树。

问题

给定一个由具有三个关键属性的对象组成的平面 JSON 数组：

id：每个节点的唯一标识符
parentId：节点的标识符节点的父节点（0 表示根节点）
level：树中节点的深度

任务是将这个平面数组转换为分层树结构，其中每个父节点封装其子节点。

解决方案

一种有效的方法利用用于构建树的地图查找算法。该算法迭代平面数组两次：

初始化：创建一个映射，其中每个节点的 id 与其在数组中的索引相关联。为每个节点初始化子数组。
树构建：再次迭代数组，将每个节点的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中文网其他相关文章！