js数组转成树

面试题

解决方法

/**
 * 1.先根据parent_ind分组，没有parent_ind的也会生成key为undefined的一组，将作为第一层
 * 2.定义formatTree方法，参数为分好的组和一个父pid,如果组中没有pid则放反回{}
 * 3.找到的组后再次循环，并把name作为父pid去递归查找子节点
 */
let insustry_list = [{ "parent_ind": "女装", "name": "连衣裙" }, { "name": "女装" }, { "parent_ind": "女装", "name": "半身裙" }, { "parent_ind": "女装", "name": "A字裙" }, { "name": "数码" }, { "parent_ind": "数码", "name": "电脑配件" }, { "parent_ind": "电脑配件", "name": "内存" }];
console.log(convert_format())
function convert_format() {
	let data = {}
    insustry_list.forEach(ele => {
        data[ele.parent_ind] = data[ele.parent_ind] || []
        data[ele.parent_ind].push(ele)
    })
    data = function formatTree(obj, pid) {
        let result = {}
        if (!obj[pid]) {
            return {}
        }
        for (let o of obj[pid]) {
            result[o.name] = formatTree(obj, o.name)
        }
        return result
    }(data, undefined)
    return data
}

输出：

---

上面的做法针对这道面试题的，但一般我们正常获取到的数据如下：

let data = [{ id: "1", pid: "0" }, { id: "2", pid: "0" }, { id: "3", pid: "1" }, { id: "4", pid: "2" }, { id: "5", pid: "4" }]

我们转成树的时候可以在每个obj中加一个children字段作为数组存放它的子节点，页面渲染数据时也好处理。

let data = [{ id: "1", pid: "0" }, { id: "2", pid: "0" }, { id: "3", pid: "1" }, { id: "4", pid: "2" }, { id: "5", pid: "4" }]
console.log(listToTree(data, null))
function listToTree(list, parentId) {
    let obj = {}
    for (let item of list) {
        obj[item.pid] = obj[item.pid] || []
        obj[item.pid].push(item)
    }
    return formatTree(obj, parentId)
}
function formatTree(obj, parentId) {
    let result = []
    if (!obj[parentId]) {
        return result
    }
    for (let t of obj[parentId]) {
        t.children = formatTree(obj, t.id)
        result.push(t)
    }
    return result
}

输出：