JavaScript 数组转树状结构

数据如下

var data = [
        {id: 1,  parentId: 0, name: '第一级菜单A' },
        {id: 2,  parentId: 0, name: '第一级菜单B' },
        {id: 3,  parentId: 1, name: '第二级菜单A' },
        {id: 4,  parentId: 1, name: '第二级菜单B' },
        {id: 5,  parentId: 3, name: '第三级菜单A' },
        {id: 6,  parentId: 3, name: '第三级菜单B' },
        {id: 7,  parentId: 4, name: '第三级菜单C' },
        {id: 8,  parentId: 4, name: '第三级菜单D' },
        {id: 9,  parentId: 2, name: '第二级菜单C' },
        {id: 10, parentId: 2, name: '第二级菜单D' },
        {id: 11, parentId: 2, name: '第二级菜单E' }
    ]

需要转换的结果


代码如下

function array2tree(arr){
        var top = [], sub = [], tempObj = {};

        arr.forEach(function(item){
            if(item.parentId === 0){ // 顶级分类
                top.push(item)
            }else{
                sub.push(item) // 其他分类
            }
            item.children = []; // 默然添加children属性
            tempObj[item.id] = item // 用当前分类的id做key,存储在tempObj中
        })

        sub.forEach(function (item) {
            // 取父级
            var parent = tempObj[item.parentId] || {'children': []}
            // 把当前分类加入到父级的children中
            parent.children.push(item)
        })

        return top
    }
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 9,720评论 0 13
  • 生活中流传着这样一种说法:爱养花的的女人,必是懂得生活的女人,必是有情调的女人,必是耐得住寂寞的女人,必是善解人意...
    剑南诗雪阅读 11,795评论 6 9
  • 曾在“十点读书”上读到过一篇文章,题目是“闺女,别嫁得太远了”,我当时颇不以为然。我甚至还过想写一篇“闺女,你嫁多...
    星满池阅读 3,446评论 4 51
  • 【壹】 心灵鸡汤本身是个舶来语,也以为只有国外才有这种鼓励人赞扬人的故事,今天看通鉴,发现里面居然也有鸡汤呢,故事...
    苏三州阅读 1,792评论 1 2
  • 佛家有云:悟便悟了,没悟就是没悟。 我悟了,确实悟了,可还是没成,为何 动力,没动力,摇头哭笑,为何 自已明白,懒啊…
    随心居阅读 3,077评论 0 0

友情链接更多精彩内容