如何用JavaScript将层级Portfolio数组转为扁平的父子递进顺序结构？

输入示例 #

原数组结构（支持任意层级）：

[
  {Portfolio:"AMBAL", Level:1, "Immediate Parent":""},
  {Portfolio:"AMBAL-PI", Level:2, "Immediate Parent":"AMBAL"},
  {Portfolio:"AMBAL-FI", Level:2, "Immediate Parent":"AMBAL"},
  {Portfolio:"2213AMBAL", Level:3, "Immediate Parent":"AMBAL-FI"},
  {Portfolio:"2132AMBAL", Level:3, "Immediate Parent":"AMBAL-PI"}
]

需求说明 #

将上述数组转换为父节点→子节点→孙节点依次递进的扁平数组：每个父节点后紧跟其所有子节点，每个子节点后再紧跟该节点的所有子节点，以此类推。

实现方案 #

通过构建父节点映射表+递归遍历的方式实现，代码如下：

function reorderPortfolios(portfolios) {
  // 构建父节点到子节点的映射，键为父节点Portfolio值，值为子节点数组
  const parentMap = {};
  portfolios.forEach(item => {
    const parentKey = item["Immediate Parent"];
    if (!parentMap[parentKey]) {
      parentMap[parentKey] = [];
    }
    parentMap[parentKey].push(item);
  });

  const result = [];
  // 递归遍历函数：传入父节点键，依次处理所有子节点及子节点的后代
  function traverse(parentKey) {
    const children = parentMap[parentKey] || [];
    children.forEach(child => {
      result.push(child);
      // 递归处理当前节点的子节点
      traverse(child.Portfolio);
    });
  }

  // 从根节点（Immediate Parent为空字符串）开始遍历
  traverse("");
  return result;
}

使用示例 #

// 输入数组
const inputPortfolios = [
  {Portfolio:"AMBAL", Level:1, "Immediate Parent":""},
  {Portfolio:"AMBAL-PI", Level:2, "Immediate Parent":"AMBAL"},
  {Portfolio:"AMBAL-FI", Level:2, "Immediate Parent":"AMBAL"},
  {Portfolio:"2213AMBAL", Level:3, "Immediate Parent":"AMBAL-FI"},
  {Portfolio:"2132AMBAL", Level:3, "Immediate Parent":"AMBAL-PI"}
];

// 执行转换
const orderedPortfolios = reorderPortfolios(inputPortfolios);
console.log(orderedPortfolios);

执行后输出的数组顺序与预期完全一致，且支持任意深度的层级结构。

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