JavaScript 对象数组转换为嵌套对象:树形结构转换算法

本文将介绍如何将一个包含 'parentId' 属性的 JavaScript 对象数组转换为嵌套对象(树形结构)。

原数组

[
  {id: 1, name: 'a', parentId: null},
  {id: 2, name: 'b', parentId: 1},
  {id: 3, name: 'c', parentId: 2},
  {id: 4, name: 'd', parentId: 1},
  {id: 5, name: 'e', parentId: 4},
  {id: 6, name: 'f', parentId: 2},
  {id: 7, name: 'g', parentId: null},
  {id: 8, name: 'h', parentId: 7},
  {id: 9, name: 'i', parentId: 8}
]

转换后的对象嵌套

[
  {
    id: 1,
    name: 'a',
    parentId: null,
    children: [
      {
        id: 2,
        name: 'b',
        parentId: 1,
        children: [
          {
            id: 3,
            name: 'c',
            parentId: 2,
            children: []
          },
          {
            id: 6,
            name: 'f',
            parentId: 2,
            children: []
          }
        ]
      },
      {
        id: 4,
        name: 'd',
        parentId: 1,
        children: [
          {
            id: 5,
            name: 'e',
            parentId: 4,
            children: []
          }
        ]
      }
    ]
  },
  {
    id: 7,
    name: 'g',
    parentId: null,
    children: [
      {
        id: 8,
        name: 'h',
        parentId: 7,
        children: [
          {
            id: 9,
            name: 'i',
            parentId: 8,
            children: []
          }
        ]
      }
    ]
  }
]

代码实现

function treeify(arr) {
  const result = [];
  const map = {};
  // 将数组转换为 map,方便查找
  arr.forEach(item => {
    map[item.id] = item;
  });
  // 遍历数组,构建树形结构
  arr.forEach(item => {
    if (item.parentId === null) {
      result.push(item);
    } else {
      if (!map[item.parentId].children) {
        map[item.parentId].children = [];
      }
      map[item.parentId].children.push(item);
    }
  });
  return result;
}

// 使用示例
const data = [
  {id: 1, name: 'a', parentId: null},
  {id: 2, name: 'b', parentId: 1},
  {id: 3, name: 'c', parentId: 2},
  {id: 4, name: 'd', parentId: 1},
  {id: 5, name: 'e', parentId: 4},
  {id: 6, name: 'f', parentId: 2},
  {id: 7, name: 'g', parentId: null},
  {id: 8, name: 'h', parentId: 7},
  {id: 9, name: 'i', parentId: 8}
];
const tree = treeify(data);
console.log(tree);

总结

本文介绍了如何将一个包含 'parentId' 属性的 JavaScript 对象数组转换为嵌套对象(树形结构)。该算法通过创建 map 来快速查找父节点,并遍历数组构建树形结构。希望本文对你有所帮助。

JavaScript 对象数组转换为嵌套对象:树形结构转换算法

原文地址: https://www.cveoy.top/t/topic/l5BR 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录