树形数组的展开

75 阅读1分钟
const arr = [{
  name: '最外层节点',
  id: '-1',
  parentId: null,
  children: [{
    name: '第一层节点',
    id: '1',
    parentId: null,
    children: [{
      name: '第二层节点',
      id: '1-1',
      parentId: '1',
      children: [
        {
          name: '第三层节点',
          id: '1-1-1',
          parentId: '1-1',
          children: [{
            name: '第四层节点',
            id: '1-1-1-1',
            parentId: '1-1-1',
            children: [{
              name: '第五层节点',
              id: '1-1-1-1-1',
              parentId: '1-1-1-1',
              children: [
                {
                  name: '第六层节点',
                  id: '1-1-1-1-1-1',
                  parentId: '1-1-1-1-1',
                  children: []
                }
              ]
            }]
          }]
        }
      ]
    }]
  }]
}]

function flatternTree(arr = [], res = []) {
  for (let i = 0; i < arr.length; i++) {
    const item = arr[i] ?? {};
    res.push(item);
    const val = Array.isArray(item.children) ? item.children : []
    Reflect.deleteProperty(item, 'children');
    flatternTree(val, res)
  }
  return res;
}
console.log(flatternTree(arr))
/*
  输出结果:
      [
        {
            "name": "最外层节点",
            "id": "-1",
            "parentId": null
        },
        {
            "name": "第一层节点",
            "id": "1",
            "parentId": null
        },
        {
            "name": "第二层节点",
            "id": "1-1",
            "parentId": "1"
        },
        {
            "name": "第三层节点",
            "id": "1-1-1",
            "parentId": "1-1"
        },
        {
            "name": "第四层节点",
            "id": "1-1-1-1",
            "parentId": "1-1-1"
        },
        {
            "name": "第五层节点",
            "id": "1-1-1-1-1",
            "parentId": "1-1-1-1"
        },
        {
            "name": "第六层节点",
            "id": "1-1-1-1-1-1",
            "parentId": "1-1-1-1-1"
        }
      ]
*/