树形结构转一维数组

关键代码

// 将treeObj中的所有对象，放入一个数组中，要求某个对象在另一个对象的children时，其parent_id是对应的它父对象的code
// 其原理实际上是数据结构中的广度优先遍历

tree2Arr(treeObj, rootid) {
    const temp = []; // 设置临时数组，用来存放队列
    const out = [];	// 设置输出数组，用来存放要输出的一维数组
    temp.push(treeObj);	
    let pid = rootid;  // 设置根元素的parent_id
    const obj = this.deepClone(treeObj);
    obj.parent_id = pid;
    delete obj["children"]; 
    out.push(obj);	// 将根元素存放入out中
    // 对树对象进行广度优先遍历
    while (temp.length > 0) {
        const first = temp.shift();
        const children = first.children;
        if (children && children.length > 0) {
            pid = first.code;
            const len = first.children.length;
            for (let i = 0; i < len; i++) {
                temp.push(children[i]);
                const obj = this.deepClone(children[i]);
                obj.parent_id = pid;
                delete obj["children"];
                out.push(obj);
            }
        }
    }
    return out;
},

深拷贝：

这里要补充一下，这里没有考虑基本类型的数据，是因为只有遇到对象类型的时候才会调这个方法，所以就不考虑基本类型的数据了。 当然也没考虑Date、Symbol等类型的数据，网上关于深拷贝的文章有很多了，就不再写了

deepClone(obj) {
    // 深拷贝方法
    if (obj === null || typeof obj !== "object") return obj;
    let cpObj = obj instanceof Array ? [] : {};
    for (let key in obj) cpObj[key] = this.deepClone(obj[key]);
    return cpObj;
},

使用

树形结构数据：

{
    "commodity": [
        {
            "code": "0001",
            "name": "商品1号",
            "children": [
                {
                    "code": "00011",
                    "name": "商品2号",
                    "children": []
                },
                {
                    "code": "00012",
                    "name": "商品3号",
                    "children": [
                        {
                            "code": "000111",
                            "name": "商品4号",
                            "children": [
                                {
                                    "code": "000112",
                                    "name": "商品5号",
                                    "children": []
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "code": "0002",
            "name": "商品6号",
            "children": [
                {
                    "code": "00021",
                    "name": "商品7号",
                    "children": [
                        {
                            "code": "00022",
                            "name": "商品8号",
                            "children": []
                        }
                    ]
                }
            ]
        },
        {
            "code": "0003",
            "name": "商品9号",
            "children": []
        }
    ]
}

这里的数据格式由于是一个数组，每一个数组元素都是一个树形结构数据，所以可以用遍历的方式，将每一个树形结构数据转换，再添加到新数组中。

let data=dataJSON;
let dataList=[];
data.forEach(item=>{
    dataList.push(...tree2Arr(item, '/'));
})

树形结构数据

转换后的一维数组数据

参考：JS中树形对象与数组之间的相互转换 (opens new window)