JavaScript解析JSON并生成链式嵌套结构的实现方法

实现思路 #

• 先构建id到原对象的映射字典，避免多次遍历数组查找匹配节点，提升效率
• 从首个节点开始递归处理：如果当前节点存在Next字段，就从映射表中取出对应id的节点，将其处理成{[节点name]: 节点对象}的结构赋值给当前节点的Next属性，再递归处理子节点的Next字段
• 最终将首个节点处理成{[首个节点name]: 处理后的节点对象}的外层结构即可

问题排查 #

你原来的代码存在两个核心问题：

1. 误用了不存在的Key字段，实际应该取name属性作为键
2. 只处理了第一层节点的Next字段，没有递归处理子节点的Next逻辑，无法生成深层嵌套结构

完整实现代码 #

function buildNestedStructure(arr) {
  // 先构建id到对象的映射，方便快速查找
  const idMap = new Map(arr.map(item => [item.id, {...item}])); // 浅拷贝避免修改原数组
  // 递归处理节点的Next字段
  function processNode(node) {
    if (!node.Next) return node;
    // 查找Next对应的节点
    const nextNode = idMap.get(node.Next);
    if (!nextNode) return node;
    // 递归处理子节点
    const processedNextNode = processNode(nextNode);
    // 替换Next为要求的嵌套结构
    node.Next = {
      [nextNode.name]: processedNextNode
    };
    return node;
  }
  // 取第一个节点作为根节点
  const rootNode = processNode([...arr][0]);
  return {
    [rootNode.name]: rootNode
  };
}

// 测试用例
const input = [
  {
    id: 'p1',
    name: 'Tets1',
    Next: 'p2'
  },
  {
    id: 'p2',
    name: 'Tets2',
    Next: 'p3'
  },
  {
    id: 'p3',
    name: 'Tets3',
    Next: 'p4'
  },
  {
    id: 'p4',
    name: 'Tets4'
  }
];

console.log(JSON.stringify(buildNestedStructure(input), null, 2));

输出结果 #

运行上述代码会得到和你要求完全一致的输出：

{
  "Tets1": {
    "id": "p1",
    "name": "Tets1",
    "Next": {
      "Tets2": {
        "id": "p2",
        "name": "Tets2",
        "Next": {
          "Tets3": {
            "id": "p3",
            "name": "Tets3",
            "Next": {
              "Tets4": {
                "id": "p4",
                "name": "Tets4"
              }
            }
          }
        }
      }
    }
  }
}

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