javascript 将数据列表处理成树形有层级关系的列表方法

/**
     * 数组转树形结构数据
     * @param list  传入源数据列表
     * @param id  定义源数据中确定数据唯一性的属性
     * @param parentId  定义源数据中确定上下层级关系的属性
     */
    function arrToTree(list,id = 'id',parentId = 'pId') {
        // 定义一个最终返回的数据包
        let result = []
        // 如果传进来的数据不是数组则返回空数组
        if (!Array.isArray(list)) {
            return result
        }
        // 为了方法能够通用首先将数据做一次净化处理
        list.forEach(function(item){
            item.children && delete item.children
        })
        // 将数据处理成以唯一值ID为key的map结构数据
        var map = {}
        list.forEach(function(item){
            map[item[id]] = item
        })
        // 根据子级数据是否有归属来确定应该挂载的节点数据
        list.forEach(function(item){
            var parent = map[item[parentId]]
            if (parent) {
                // 利用或运算符来简化判断条件
                (parent.children || (parent.children = [])).push(item)
            } else {
                result.push(item)
            }
        })
        console.log('result',result)
        // 返回处理后的数据
        return result
    }
  • 5
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值