如何在JavaScript中将普通对象数组转换为多级数组？

嘿，这个需求我经常碰到！把扁平的带parent_id的数组转成多级树形结构其实不难，我给你分享一个高效的实现思路和代码：

核心思路 #

我们可以通过建立节点映射表的方式快速关联父节点和子节点，只需要遍历数组两次就能完成转换，时间复杂度是O(n)，效率很高：

1. 先把每个节点存到一个对象里（key为节点id），同时给每个节点初始化一个children空数组；
2. 再次遍历数组，把每个节点挂载到对应父节点的children数组中；
3. 最后收集所有parent_id为null的根节点，就是最终的多级数组。

具体代码实现 #

var b = [ 
  {id: 1, name: 'England',parent_id: null}, 
  {id: 2, name: 'Spain',parent_id: null}, 
  {id: 3, name: 'Chelsea',parent_id: 1}, 
  {id: 4, name: 'Manchester United',parent_id: 1}, 
  {id: 5, name: 'Real Madrid',parent_id: 2}, 
  {id: 6, name: 'Barcelona',parent_id: 2}, 
  {id: 7, name: 'Hazard',parent_id: 3}, 
  {id: 8, name: 'Morata',parent_id: 3}, 
  {id: 9, name: 'Pogba',parent_id: 4}, 
  {id: 10, name: 'Lukaku',parent_id: 4}, 
  {id: 11, name: 'Ronaldo',parent_id: 5}
];

function buildTree(arr) {
  const nodeMap = {};
  const tree = [];

  // 初始化节点映射表，给每个节点添加children属性
  arr.forEach(node => {
    nodeMap[node.id] = {...node, children: []};
  });

  // 挂载子节点到父节点
  arr.forEach(node => {
    if (node.parent_id !== null) {
      // 增加父节点存在判断，避免无效parent_id导致报错
      if (nodeMap[node.parent_id]) {
        nodeMap[node.parent_id].children.push(nodeMap[node.id]);
      }
    } else {
      // 根节点直接加入树形数组
      tree.push(nodeMap[node.id]);
    }
  });

  return tree;
}

// 调用函数得到多级数组
const nestedTree = buildTree(b);
console.log(nestedTree);

代码说明 #

• 用nodeMap存储每个节点的引用，查找父节点时不用重复遍历数组，直接通过id快速定位；
• 使用扩展运算符{...node}是为了不修改原数组的节点对象，保持原始数据的纯净性；
• 额外添加的父节点存在判断，能避免数组里出现无效parent_id时报错，让代码更健壮。

运行这段代码后，你得到的nestedTree就是符合需求的多级数组结构，每个节点下的children数组就是它的子节点集合。

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