JS 二维数组转树结构

2020-06-16  本文已影响0人  亦然Dir
// 原始数组
let input = [
    ["新闻", "体育", "网球", "国外"],
    ["新闻", "体育", "网球", "国内"],
    ["产品", "互联网", "金融"],
    ["新闻", "房产", "深圳"],
    ["新闻", "房产", "上海"],
    ["新闻", "体育", "羽毛球"],
    ["产品", "互联网", "保险"]
]
// 得到的期望值
let ouput = [{
    "name": "新闻",
    "children": [{
        "name": "体育",
        "children": [{
            "name": "网球",
            "children": [{
                "name": "国外"
            }, {
                "name": "国内"
            }]
        }, {
            "name": "羽毛球"
        }]
    }, {
        "name": "房产",
        "children": [{
            "name": "深圳"
        }, {
            "name": "上海"
        }]
    }]
}, {
    "name": "产品",
    "children": [{
        "name": "互联网",
        "children": [{
            "name": "金融"
        }, {
            "name": "保险"
        }]
    }]
}]

学习了一下class类 用class类简单写一个

    class Point {
    // 在构造函数里面将对象初始化成我想要的格式
        constructor(arr) {
            this.obj = {}
            this.initTree(arr)
        }
        initTree(params, curr) {
            if (Array.isArray(params)) {
                params.forEach(v => {
                    this.initTree(v, params)
                })
            } else {
                let index = curr.indexOf(params)
                this.obj[index] || (this.obj[index] = {})
                if (!curr[index - 1]) {
                    this.obj[index][params] = {
                        parent: 'root',
                        hasChildre: curr[index + 1] ? true : false,
                        name: params
                    }
                } else {
                    this.obj[index][params] = {
                        parent: curr[index - 1],
                        hasChildre: curr[index + 1] ? true : false,
                        name: params
                    }
                }
            }
        }
        getChildred(i, parentName) {
            let index = Number(i) + 1
            let currChildren = this.obj[index]
            let children = []
            Object.keys(currChildren).forEach(c => {
                if (currChildren[c].parent === parentName) {
                    children.push({
                        name: currChildren[c].name,
                        children: currChildren[c].hasChildre ? this.getChildred(Number(i) + 1, currChildren[c].name) : undefined
                    })
                }
            })
            return children
        }
        getTree() {
            let tree = []
            // 循环数组拿到根目录 判断是否有子节点 然后递归调用子节点
            Object.keys(this.obj).forEach(i => {
                let ins = this.obj[i]
                Object.keys(ins).forEach(v => {
                    if (ins[v].parent === 'root') {
                        tree.push({
                            name: ins[v].name,
                            children: ins[v].hasChildre ? this.getChildred(i, ins[v].name) : undefined
                        })
                    }
                })
            })
            // 这里用转JSON是为了去掉undefined的chilidren
            return JSON.parse(JSON.stringify(tree))
        }
    }

    var point = new Point(arr);

    console.log(point, point.getTree());
上一篇下一篇

猜你喜欢

热点阅读