javascript - 如何将具有存储为键值对象的节点的树转换为具有存储为 Javascript 中的对象数组的节点的树结构？

Question

我正在尝试将具有存储为键值对象的节点的树结构转换为具有存储为对象数组的节点的树结构。我怎样才能实现它？

示例：我想转换此结构：

const treeX = [
  {
    id: '7d2a730a-53b7-4ce6-b791-446a7dc3d97e',
    name: 'category1',
    nodes: {
      'd043f4bd-6d3f-478c-b4ea-a5fc1ad66fb1': {
        name: 'subcategory2',
        id: 'd043f4bd-6d3f-478c-b4ea-a5fc1ad66fb1',
        nodes: {
          '69c7481d-d8c3-41da-b8fa-84d6056f6344': {
            name: 'subsubcategory3',
            id: '69c7481d-d8c3-41da-b8fa-84d6056f6344',
            nodes: {},
          },
          '184e0b3d-108c-45ee-8c62-a81b73bf5b7b': {
            name: 'subsubcategory4',
            id: '184e0b3d-108c-45ee-8c62-a81b73bf5b7b',
            nodes: {},
          },
        },
      },
      '0ec9a897-6e06-4c06-a780-b37ce8fd51f7': {
        name: 'subcategory5',
        id: '0ec9a897-6e06-4c06-a780-b37ce8fd51f7',
        nodes: {
          '9531f8d4-0d28-4a89-8d4e-ddd3ceea4939': {
            name: 'subsubcategory6',
            id: '9531f8d4-0d28-4a89-8d4e-ddd3ceea4939',
            nodes: {},
          },
          '2f32f5b8-0abb-48e1-b6ad-b7f00aba02ca': {
            name: 'subsubcategory7',
            id: '2f32f5b8-0abb-48e1-b6ad-b7f00aba02ca',
            nodes: {},
          },
        },
      },
    },
  },
  {
    id: '985ab20a-53b7-4ce6-b791-446a7dc3d97e',
    name: 'category8',
    nodes: {
      '26b97abd-6d3f-478c-b4ea-a5fc1ad66fb1': {
        name: 'subcategory9',
        id: '236b45bd-6d3f-478c-b4ea-a5fc1ad66fb1',
        nodes: {},
      },
    },
  },
];

至：

const treeY = [
  {
    id: '7d2a730a-53b7-4ce6-b791-446a7dc3d97e',
    name: 'category1',
    nodes: [
      {
        name: 'subcategory2',
        id: 'd043f4bd-6d3f-478c-b4ea-a5fc1ad66fb1',
        nodes: [
          {
            name: 'subsubcategory3',
            id: '69c7481d-d8c3-41da-b8fa-84d6056f6344',
            nodes: [],
          },
          {
            name: 'subsubcategory4',
            id: '184e0b3d-108c-45ee-8c62-a81b73bf5b7b',
            nodes: [],
          },
        ],
      },
      {
        name: 'subcategory5',
        id: '0ec9a897-6e06-4c06-a780-b37ce8fd51f7',
        nodes: [
          {
            name: 'subsubcategory6',
            id: '9531f8d4-0d28-4a89-8d4e-ddd3ceea4939',
            nodes: [],
          },
          {
            name: 'subsubcategory7',
            id: '2f32f5b8-0abb-48e1-b6ad-b7f00aba02ca',
            nodes: [],
          },
        ],
      },
    ],
  },
  {
    id: '985ab20a-53b7-4ce6-b791-446a7dc3d97e',
    name: 'category8',
    nodes: [
      {
        name: 'subcategory9',
        id: '236b45bd-6d3f-478c-b4ea-a5fc1ad66fb1',
        nodes: [],
      },
    ],
  },
];

我如何实现它的方式：

categories.forEach(category => {
    category.nodes = Object.values(category.nodes);
    category.nodes?.forEach(subcategory => {
        subcategory.nodes = Object.values(subcategory.nodes);
        subcategory.nodes?.forEach(subsubcategory => {
            subsubcategory.nodes = Object.values(subsubcategory.nodes);
            subsubcategory.nodes?.forEach(subsubsubcategory => {
                subsubsubcategory.nodes = Object.values(subsubsubcategory.nodes)
            })
        })
    })
});

我知道该解决方案绝对无效，如果树有更多级别，它将无法工作。因此，我想问一下，如何改进代码？也许使用递归函数？

标签： javascriptarraysobject

Answer 1

在我看来，您真正需要的只是递归地映射Object.values属性nodes：

const treeX=[{id:"7d2a730a-53b7-4ce6-b791-446a7dc3d97e",name:"category1",nodes:{"d043f4bd-6d3f-478c-b4ea-a5fc1ad66fb1":{name:"subcategory2",id:"d043f4bd-6d3f-478c-b4ea-a5fc1ad66fb1",nodes:{"69c7481d-d8c3-41da-b8fa-84d6056f6344":{name:"subsubcategory3",id:"69c7481d-d8c3-41da-b8fa-84d6056f6344",nodes:{}},"184e0b3d-108c-45ee-8c62-a81b73bf5b7b":{name:"subsubcategory4",id:"184e0b3d-108c-45ee-8c62-a81b73bf5b7b",nodes:{}}}},"0ec9a897-6e06-4c06-a780-b37ce8fd51f7":{name:"subcategory5",id:"0ec9a897-6e06-4c06-a780-b37ce8fd51f7",nodes:{"9531f8d4-0d28-4a89-8d4e-ddd3ceea4939":{name:"subsubcategory6",id:"9531f8d4-0d28-4a89-8d4e-ddd3ceea4939",nodes:{}},"2f32f5b8-0abb-48e1-b6ad-b7f00aba02ca":{name:"subsubcategory7",id:"2f32f5b8-0abb-48e1-b6ad-b7f00aba02ca",nodes:{}}}}}},{id:"985ab20a-53b7-4ce6-b791-446a7dc3d97e",name:"category8",nodes:{"26b97abd-6d3f-478c-b4ea-a5fc1ad66fb1":{name:"subcategory9",id:"236b45bd-6d3f-478c-b4ea-a5fc1ad66fb1",nodes:{}}}}];

const transformObj = (obj) => ({
  ...obj,
  nodes: Object.values(obj.nodes).map(transformObj)
});
const result = treeX.map(transformObj);
console.log(result);