一维数据格式化为树形数据---js

突然琢磨出来个很简单的算法, 希望对大家有思路上的帮助

let baseArr = [
  {id: 1, pid: 0},
  {id: 2, pid: 1},
  {id: 3, pid: 2},
  {id: 4, pid: 2},
  {id: 5, pid: 1},
  {id: 6, pid: 1},
  {id: 7, pid: 5},
  {id: 8, pid: 0},
]

/**
 * 利用引用对象都是址的特性进行树形数据格式化
 * @param data 数据
 * @param id   id的key
 * @param pid  与父级数据关联的key
 * @param topPid  顶层数据的parentId的值
 * @return {*[]}
 */
function toTreeData (data, id = 'id', pid = 'pid', topPid = 0) {
  let obj = {}
  // 将所有一维数据整理到对象中,方便接下来操作
  for (let i = 0; i < data.length; i++) {
    obj[data[i][id]] = {...data[i], children: undefined}
  }
  // 最终返回的数据
  let returnArr = []

  for (let i = 0; i < data.length; i++) {
    // 判断本条数据的父id是否是顶层id
    // 如果是 则直接添加到 returnArr中
    // 如果不是 则找到本行数据在obj中的对象 放入其父节点的children中
    if (data[i][pid] !== topPid) {
      obj[data[i][pid]].children ? '' : (obj[data[i][pid]].children=[])
      obj[data[i][pid]].children.push(obj[data[i][id]])
    } else {
      returnArr.push(obj[data[i][id]])
    }
  }
  return returnArr
}
console.log(toTreeData(baseArr))
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值