扁平数组与树形结构数组相互转换

扁平数组转树形结构数组

先定义一个数组
let dataSet = [
  { id: 1, parentId: 0, name: '1' },
  { id: 2, parentId: 0, name: '1' },
  { id: 11, parentId: 1, name: '1-1' },
  { id: 21, parentId: 2, name: '2-1' },
  { id: 211, parentId: 21, name: '2-1-1' },
  { id: 22, parentId: 2, name: '2-2' },
];

转树形结构数组

  1. 方法一 forEach
function buildfun1(dataSet, parentId) {
  let arr = [];
  dataSet.forEach((t) => {
    if (t.parentId === parentId) {
      t.children = buildfun1(dataSet, t.id);
      arr.push(t);
    }
  });
  return arr;
}
const tree1 = buildfun1(dataSet, 0);
console.log('tree1', tree1);
  1. 方法二 reduce
function buildfun2(dataSet, parentId = 0) {
  return dataSet.reduce((pre, cur) => {
    if (cur.parentId === parentId) {
      cur.children = buildfun2(dataSet, cur.id).sort((a, b) => a.id - b.id);
      pre.push(cur);
    }
    return pre.sort((a, b) => a.id - b.id);
  }, []);
}
const tree2 = buildfun2(dataSet, 0);
console.log('tree2', tree2);
  1. 方法三 filter
function buildfun3(dataSet) {
  return dataSet
    .filter((t) => {
      t.children = dataSet
        .filter((c) => {
          return c.parentId === t.id;
        })
        .sort((a, b) => a.id - b.id);
      return t.parentId === 0;
    })
    .sort((a, b) => a.id - b.id);
}
const tree3 = buildfun3(dataSet, 0);
console.log('tree3', tree3);

树形结构数组转扁平数组

定义一个树形结构数组

let treeData = [
  {
    id: 1,
    name: '1',
    parentId: 0,
    children: [
      {
        id: 11,
        name: '1-1',
        parentId: 0,
        children: [],
      },
    ],
  },
  {
    id: 2,
    name: '2',
    parentId: 0,
    children: [
      {
        id: 21,
        name: '2-1',
        parentId: 0,
        children: [
          {
            id: 211,
            name: '2-1-1',
            parentId: 21,
            children: [],
          },
          {
            id: 212,
            name: '2-1-2',
            parentId: 21,
            children: [],
          },
        ],
      },
      {
        id: 22,
        name: '2-2',
        parentId: 0,
        children: [],
      },
    ],
  },
];

转扁平数组

  1. 方法一 reduce
function flat(treeData) {
  return treeData.reduce((pre, cur) => {
    return pre.concat({ id: cur.id, parentId: cur.parentId, name: cur.name }, cur?.children ? flat(cur?.children) : []);
  }, []);
}
const flatData1 = flat(treeData);
console.log('flatData1', flatData1);
  1. 方法二 forEach
function flat2(treeData, arr = []) {
  treeData.forEach((t) => {
    arr.push({
      id: t.id,
      parentId: t.parentId,
      name: t.name,
    });
    if (t?.children?.length) {
      flat2(t?.children, arr);
    }
  });
  return arr.sort((a, b) => a.parentId - b.parentId);
}

const flatData2 = flat2(treeData);
console.log('flatData2', flatData2);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值