使用带有递归的reduce函数从多级树生成一个平面的id数组？

Question

我正在尝试使用 js 库orgChart实现用户层次结构。通过getHierarchy()库中的方法正在输出如下所示的对象。

var datascource = {
            "id": "1",
            "children": [{
                "id": "2"
            }, {
                "id": "3",
                "children": [{
                    "id": "4"
                }, {
                    "id": "5",
                    "children": [{
                        "id": "6"
                    }, {
                        "id": "7"
                    }]
                }]
            }, {
                "id": "10"
            }, {
                "id": "12"
            }]
        };

我想从树中的 id 生成平面数组。前任：//["1", "2", "3", "4", "5", "6", "7", "10", "12"]

我想出了，

function getNestedArraysOfIds(node) {
    if (node.children == undefined) {
        return [node.id];
    } else {
        return [node.id,...node.children.map(subnode => (subnode.children==undefined) ? subnode.id: getNestedArraysOfIds(subnode))];
    }
}

function getIds(array) {
        return array.reduce((acc, subArray) =>
            (Array.isArray(subArray)) ? [...acc, ...getIds(subArray)] : [...acc, subArray]);
    }

var idArrays = getNestedArraysOfIds(datascource );
var ids = getIds(idArrays); //["1", "2", "3", "4", "5", "6", "7", "10", "12"]

我尝试使用单个 reduce 函数来完成它，但最终我编写了两个函数，它们都是递归的。有没有很多优雅有效的方法可以用单一的reduce函数来做到这一点？

先感谢您。

Answer 1

您可以通过使用 进行映射来使孩子变平concat。

function getFlat({ id, children = [] }) {
    return [id].concat(...children.map(getFlat));
}

var data = { id: "1", children: [{ id: "2" }, { id: "3", children: [{ id: "4" }, { id: "5", children: [{ id: "6" }, { id: "7" }] }] }, { id: "10" }, { id: "12" }] };

console.log(getFlat(data));

与减少功能相同

function getFlat({ id, children = [] }) {
    return children.reduce((r, o) => [...r, ...getFlat(o)], [id]);
}

var data = { id: "1", children: [{ id: "2" }, { id: "3", children: [{ id: "4" }, { id: "5", children: [{ id: "6" }, { id: "7" }] }] }, { id: "10" }, { id: "12" }] };

console.log(getFlat(data));