无限级分类

前情提要：当我们在做一些商城网站的时候，往往会有一种分类，叫做无限级分类，即：父类下面包含子类，子类又作为父类包含子类，以此类推。如下图所示（淘宝官网）。

原始数据的获取（一般都是从数据库取出）

假设获取的数据为：

let arr = [
    {"id":1,"name":"手机数码","pid":0},
    {"id":2,"name":"家用电器","pid":0},
    {"id":3,"name":"美妆护肤","pid":0},
    {"id":4,"name":"钟表珠宝","pid":0},
    {"id":16,"name":"小米","pid":1},
    {"id":17,"name":"华为","pid":1},
    {"id":18,"name":"卡西欧","pid":4},
    {"id":19,"name":"魅族","pid":1},
    {"id":21,"name":"美的","pid":2},
    {"id":24,"name":"红米","pid":16}
]

具体的分类代码

function tree(arr){
    /*首先将每个数据转化成对象的形式(方便寻找父级)*/
    let map = {};
    arr.forEach(function(item){
        map[item.id] = item;
    })
    /*分类*/
    let cate = [];
    arr.forEach(function(item){
        let parent = map[item.pid];
        if(parent){
            (parent.children || (parent.children = [])).push(item);
        }else{
            cate.push(item);
        }
    });
    return cate;
}

输出分类数组

[{
    "id": 1,
    "name": "手机数码",
    "pid": 0,
    "children": [{
        "id": 16,
        "name": "小米",
        "pid": 1,
        "children": [{
            "id": 24,
            "name": "红米",
            "pid": 16
        }]
    }, {
        "id": 17,
        "name": "华为",
        "pid": 1
    }, {
        "id": 19,
        "name": "魅族",
        "pid": 1
    }]
}, {
    "id": 2,
    "name": "家用电器",
    "pid": 0,
    "children": [{
        "id": 21,
        "name": "美的",
        "pid": 2
    }]
}, {
    "id": 3,
    "name": "美妆护肤",
    "pid": 0
}, {
    "id": 4,
    "name": "钟表珠宝",
    "pid": 0,
    "children": [{
        "id": 18,
        "name": "卡西欧",
        "pid": 4
    }]
}]