求助：基于映射关系递归生成嵌套结构对象失败

现有包含映射信息的对象数组obj1和对应值的数组vals，当前代码只能生成扁平结构，无法正确递归生成带有children属性的嵌套目标结构。

期望输出结构 #

const expectedData = {
    cities: {
        values: [{}],
    },
    category: {
        values: [{}],
        children: {
            type: {
                values: [{}],
                children: {
                    otherType: {
                        values: [{}],
                    }
                }
            }
        }
    },
    age: {
        values: [{}]
    }
}

现有问题代码 #

const obj1 = [
  {
    mapping: "cities",
  },
  {
    mapping: "category",
    children: {
      mapping: "type",
      children: {
        mapping: "otherType",
      },
    },
  },
  {
    mapping: "age",
  },
];

const vals = [
  {
    mapping: "category",
    values: [{}],
  },
  {
    mapping: "type",
    values: [{}],
  },
  {
    mapping: "otherType",
    values: [{}],
  },
  {
    mapping: "cities",
    values: [{}],
  },
  {
    mapping: "age",
    values: [{}],
  },
];

const processItem = (config, vals) => {
  const isDataAvailable = vals.find(
    (item) => item.category === config.category,
  );

  if (isDataAvailable) {
    if (config.children) {
      processItem(config.children, vals);
    }

    const { mapping } = config;
    finalData.push({
      mapping,
      values: isDataAvailable.values,
    });
  }
};

config.forEach((config) => processItem(config, values));

核心思路 #

• 先将vals转换为映射表，通过mapping快速查找对应值，避免重复遍历提升效率。
• 递归函数返回当前节点结构，而非直接修改外部变量，确保子节点能正确挂载到父节点的children属性。
• 遍历顶层配置数组，逐个生成节点并合并到最终对象。

完整实现代码 #

const obj1 = [
  { mapping: "cities" },
  {
    mapping: "category",
    children: {
      mapping: "type",
      children: { mapping: "otherType" },
    },
  },
  { mapping: "age" },
];

const vals = [
  { mapping: "category", values: [{}] },
  { mapping: "type", values: [{}] },
  { mapping: "otherType", values: [{}] },
  { mapping: "cities", values: [{}] },
  { mapping: "age", values: [{}] },
];

// 构建映射表，快速通过mapping获取对应values
const valueMap = new Map(vals.map(item => [item.mapping, item.values]));

// 递归生成单个节点结构
const buildNode = (config) => {
  // 初始化当前节点，获取对应values
  const node = { values: valueMap.get(config.mapping) || [] };
  
  // 处理子节点：递归生成后挂载到children属性
  if (config.children) {
    const childNode = buildNode(config.children);
    node.children = {
      [config.children.mapping]: childNode
    };
  }
  
  return node;
};

// 遍历所有顶层配置，组装最终结果
const expectedData = {};
obj1.forEach(config => {
  expectedData[config.mapping] = buildNode(config);
});

console.log(expectedData);

关键细节说明 #

1. valueMap映射表：将vals转换为Map结构，把mapping作为键、values作为值，后续查找只需O(1)时间，比原代码的find方法更高效。
2. buildNode递归函数：
   • 先创建当前节点的基础结构，包含values字段。
   • 若配置存在children，递归调用buildNode生成子节点，再以子配置的mapping为键，将子节点挂载到当前节点的children对象中。
3. 组装最终对象：遍历obj1的每个顶层配置，调用buildNode生成对应节点，将其添加到expectedData中，键为当前配置的mapping。

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