如何利用节点索引从树形数据结构生成扁平数组？

问题需求 #

需要基于层级树形数据，将parentNode-childNode-...格式的节点路径字符串数组，转换为对应层级键值对的扁平对象数组。

原始代码问题 #

你当前的代码错误在于直接用Object.keys(TREE_DATA)[Number(node)]获取数组索引字符串，而非逐层遍历树形结构提取节点的name值，导致输出结果完全不符合预期。

修正后的代码 #

const TREE_DATA = [{
    name: 'USA',
    children: [{
        name: 'Texas',
        children: [{
            name: 'Dallas'
        }, {
            name: 'Houston'
        }]
    }, {
        name: 'California',
        children: [{
            name: 'Los Angeles'
        }, {
            name: 'San Francisco'
        }]
    }, {
        name: 'New York',
        children: [{
            name: 'New York City'
        }, {
            name: 'Buffalo'
        }]
    }],
}, {
    name: 'India',
    children: [{
        name: 'Bihar',
        children: [{
            name: 'Patna'
        }, {
            name: 'Gaya'
        }],
    }],
}, ];

let treeDataGroupedBy = ['Country', 'State', 'City'];
let treeNodeInput = ['0-0-0', '1-0-1'];
let data = [];

for (let item of treeNodeInput) {
    let nodesArray = item.split("-").map(Number); // 转换为数字索引
    let currentLevelNodes = TREE_DATA; // 从顶层节点开始遍历
    let rowObj = {};
    
    for (let i = 0; i < nodesArray.length; i++) {
        const index = nodesArray[i];
        const currentNode = currentLevelNodes[index];
        // 赋值对应层级的键值
        rowObj[treeDataGroupedBy[i]] = currentNode.name;
        // 切换到下一层级的节点列表（存在children则继续，否则为空数组）
        currentLevelNodes = currentNode.children || [];
    }
    
    data.push(rowObj);
}

console.log(data);
// 输出结果：
// [
//   { Country: 'USA', State: 'Texas', City: 'Dallas' },
//   { Country: 'India', State: 'Bihar', City: 'Gaya' }
// ]

代码说明 #

• 先将路径字符串拆分并转为数字索引数组，方便定位节点位置
• 从树形数据的顶层节点开始，逐层根据索引匹配对应节点
• 将节点的name值赋值给treeDataGroupedBy中对应的层级键
• 每完成一层遍历后，切换到当前节点的children列表，继续下一层的节点查找

内容的提问来源于stack exchange，提问作者Jason22