如何基于对象数组与子元素数组递归创建嵌套对象？

问题说明 #

需要根据给定的反应数组，以指定target为起点，构建嵌套树形结构：

• 每个节点的name为数据标识（如Data #4）
• 节点的children由其对应的反应sources中的数据组成
• 若某个source同时是某条反应的target，则该source作为子节点继续嵌套其对应的sources

示例输入数据 #

{
  "reactions": [
    {
      "name": "Ester amidation",
      "target": "Data #1",
      "sources": ["Data #2", "Data #3"]
    },
    {
      "name": "Buchwald-Hartwig amination with amide",
      "target": "Data #4",
      "sources": ["Data #5", "Data #1"]
    }
  ]
}

期望输出（以Data #4为target） #

{
  name: "My Route 1",
  children: [
    {
      name: "Data #4",
      children: [
        {
          name: "Data #5",
          children: []
        },
        {
          name: "Data #1",
          children: [
            {
              name: "Data #2",
              children: []
            },
            {
              name: "Data #3",
              children: []
            }
          ]
        }
      ]
    }
  ]
}

用户尝试的代码 #

function createNestedTree(objects, target = null) {
    const children = objects.filter(o => o.target === target);
    if (!children.length) {
        return null;
    }
    return children.map(child => ({
        ...child,
        children: createNestedTree(objects, child.id)
    }));
}

解决方案 #

实现思路 #

1. 先构建target到反应对象的映射表，避免每次递归都遍历整个数组，提升查询效率
2. 递归函数负责生成单个数据节点：
   • 若当前数据是某个反应的target，则遍历该反应的sources，为每个source递归生成子节点
   • 若不是，则生成一个包含空children的节点
3. 最后包装成用户需要的外层结构

完整代码 #

function buildNestedTree(reactions, rootTarget) {
    // 构建target到反应的映射表，实现O(1)快速查找
    const targetMap = new Map();
    reactions.forEach(reaction => {
        targetMap.set(reaction.target, reaction);
    });

    // 递归生成单个节点
    function createNode(dataName) {
        const node = { name: dataName, children: [] };
        // 检查当前数据是否是某条反应的target
        const reaction = targetMap.get(dataName);
        if (reaction) {
            // 为每个source递归生成子节点
            node.children = reaction.sources.map(source => createNode(source));
        }
        return node;
    }

    // 包装成期望的外层结构
    return {
        name: "My Route 1",
        children: [createNode(rootTarget)]
    };
}

// 使用示例
const reactions = [
    {
        "name": "Ester amidation",
        "target": "Data #1",
        "sources": ["Data #2", "Data #3"]
    },
    {
        "name": "Buchwald-Hartwig amination with amide",
        "target": "Data #4",
        "sources": ["Data #5", "Data #1"]
    }
];

const result = buildNestedTree(reactions, "Data #4");
console.log(result);

代码说明 #

• targetMap：将每个target与对应的反应关联，避免重复遍历数组，提升递归效率
• createNode：核心递归逻辑，根据数据名称生成节点，自动处理嵌套关系
• 外层包装：直接生成符合需求的根结构，无需额外处理

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