如何将含路径字符串的对象数组转换为嵌套层级数组

问题描述 #

需要把包含路径字符串的对象数组转换为嵌套树形结构，路径以/分隔表示层级关系（如1/3/2中，1是3的父节点，3是2的父节点），支持任意层级深度和子节点数量，同时兼容末尾带/或不带/的路径格式。

解决方案 #

以下是基于JavaScript的实现方案，核心思路是通过路径映射快速定位父节点，逐步构建树形结构：

function convertToTree(items) {
  const nodeMap = new Map();
  const rootNodes = [];

  items.forEach(item => {
    // 预处理路径：移除末尾斜杠，拆分层级数组
    const pathSegments = item.path.replace(/\/$/, '').split('/');
    // 当前节点的唯一标识路径（无末尾斜杠）
    const nodeKey = pathSegments.join('/');
    // 父节点的唯一标识路径
    const parentKey = pathSegments.slice(0, -1).join('/');

    // 创建节点对象，复制原属性并初始化children数组
    const currentNode = { ...item, children: [] };
    // 根节点统一补全末尾斜杠（匹配示例格式）
    if (pathSegments.length === 1 && !currentNode.path.endsWith('/')) {
      currentNode.path += '/';
    }

    // 将节点存入映射表
    nodeMap.set(nodeKey, currentNode);

    // 挂载到父节点或根节点数组
    if (parentKey === '') {
      rootNodes.push(currentNode);
    } else {
      const parentNode = nodeMap.get(parentKey);
      if (parentNode) {
        parentNode.children.push(currentNode);
      }
    }
  });

  return rootNodes;
}

// 测试输入
const inputItems = [
  { id: 1, path: "1" },
  { id: 2, path: "1/1/1" },
  { id: 3, path: "1/1" },
  { id: 4, path: "1/1/2" },
  { id: 5, path: "2/1" },
  { id: 6, path: "2/2" },
  { id: 7, path: "2/" }
];

// 生成树形结构
const treeResult = convertToTree(inputItems);
console.log(JSON.stringify(treeResult, null, 2));

代码说明 #

1. 路径预处理：通过replace(/\/$/, '')移除路径末尾的斜杠，再用split('/')拆分成层级数组，统一处理带/和不带/的路径。
2. 节点映射表：使用Map存储每个节点的唯一路径（无末尾斜杠）和对应的节点对象，实现O(1)时间复杂度的父节点查找。
3. 节点创建与挂载：
   • 复制原始对象的属性，添加children数组用于存放子节点。
   • 根节点（路径只有一级）统一补全末尾斜杠，匹配示例输出格式。
   • 根据父路径判断节点层级，根节点直接加入根数组，非根节点挂载到对应父节点的children中。
4. 兼容性：支持任意深度的路径，无需提前定义层级结构，自动适配输入中的所有路径关系。

输出结果 #

运行上述代码后，将得到与示例完全一致的嵌套树形数组。

内容的提问来源于stack exchange，提问作者Hejhejhej123