Skip to content

tree__array - 将树结构转换成扁平数组

使用

js
import { tree__array } from 'iflyjs'
const list = []
const result = tree__array(list)

Demo

js
const testData = [
  {
    name: '主页',
    id: '1',
    parentId: '0',
    children: []
  },
  {
    name: '学习天地',
    id: '2',
    parentId: '0',
    children: [
      {
        name: '前端',
        id: '3',
        parentId: '2',
        children: [
          {
            name: 'JavaScript',
            id: '5',
            parentId: '3',
            children: [
              {
                name: 'Vue',
                id: '6',
                parentId: '5',
                children: []
              },
              {
                name: 'React',
                id: '7',
                parentId: '5',
                children: []
              }
            ]
          }
        ]
      },
      {
        name: '后端',
        id: '4',
        parentId: '2',
        children: [
          {
            name: 'Node',
            id: '8',
            parentId: '4',
            children: []
          },
          {
            name: 'Java',
            id: '9',
            parentId: '4',
            children: []
          }
        ]
      }
    ]
  },
  {
    name: '关于我们',
    id: '10',
    parentId: '0',
    children: []
  }
]
const res = tree__array(testData)
console.log(res)

输出

json
[
  {
    "name": "主页",
    "id": "1",
    "parentId": "0"
  },
  {
    "name": "学习天地",
    "id": "2",
    "parentId": "0"
  },
  {
    "name": "关于我们",
    "id": "10",
    "parentId": "0"
  },
  {
    "name": "前端",
    "id": "3",
    "parentId": "2"
  },
  {
    "name": "后端",
    "id": "4",
    "parentId": "2"
  },
  {
    "name": "JavaScript",
    "id": "5",
    "parentId": "3"
  },
  {
    "name": "Node",
    "id": "8",
    "parentId": "4"
  },
  {
    "name": "Java",
    "id": "9",
    "parentId": "4"
  },
  {
    "name": "Vue",
    "id": "6",
    "parentId": "5"
  },
  {
    "name": "React",
    "id": "7",
    "parentId": "5"
  }
]

源码

ts
function tree__array(tree: any[] = [], childField = 'children') {
  const treeNodes: any[] = [] // 用于存储待处理的节点
  const res: any[] = [] // 存储转换后的非树结构数组

  // 将根节点添加到待处理节点数组中
  for (const rootNode of tree) {
    treeNodes.push(rootNode)
  }

  // 循环处理所有节点,直到所有节点都被移出树节点数组
  while (treeNodes.length > 0) {
    const node = treeNodes.shift() // 移除并获取树节点数组的第一个节点

    // 如果当前节点有子节点,则将子节点添加到树节点数组中,以待后续处理
    if (node[childField] && node[childField].length > 0) {
      for (const childNode of node[childField]) {
        treeNodes.push(childNode)
      }
    }

    // 移除节点的子节点数组属性,准备将节点添加到结果数组中
    delete node[childField]
    res.push(node) // 将处理过的节点添加到结果数组
  }

  return res // 返回转换后的数组
}

Released under the MIT License.