如何将带缩进前缀的JavaScript数组转换为层级路径结构

我来帮你搞定这个层级路径转换的问题！你的需求是把带空格缩进的数组元素，转换成每个元素的完整层级路径（用->连接），之前的代码没考虑到层级嵌套和回退的场景，所以出了问题。

问题分析 #

你的原数组里，空格缩进代表元素的层级：

• 无空格的是顶级节点（比如"2"、"3"）
• 有1个空格的是上一个顶级节点的子节点（比如" 2.1"是"2"的子节点）
• 有2个空格的是上一级子节点的子节点（比如" 2.1.1"是"2.1"的子节点）

但你的原代码只简单取前一个元素拼接，完全没考虑层级的变化——比如当元素层级回退时（比如从" 2.1.1"回到" 2.2"），应该回到上上层的父节点，而不是直接用前一个元素。

正确解决方案 #

我们可以用一个层级栈来记录每个层级的完整路径，动态调整栈的内容来匹配当前元素的层级，这样就能正确生成每个元素的路径：

function convertToHierarchyPaths(data) {
  const result = [];
  const levelStack = []; // 存储各层级的完整路径，栈长度对应当前层级深度

  for (const item of data) {
    // 计算当前元素的缩进层级（空格的数量）
    const indentLevel = item.length - item.trimStart().length;
    const nodeText = item.trimStart();

    // 调整栈：如果当前层级比栈的深度小，弹出栈顶元素直到匹配层级
    while (levelStack.length > indentLevel) {
      levelStack.pop();
    }

    // 生成当前元素的完整路径
    const currentPath = levelStack.length === 0 
      ? nodeText 
      : `${levelStack.at(-1)}->${nodeText}`;

    result.push(currentPath);
    levelStack.push(currentPath);
  }

  return result;
}

// 测试你的原数据
const originalData = [ "2", " 2.1", "  2.1.1", " 2.2", "3", "4" ];
console.log(convertToHierarchyPaths(originalData));
// 输出：["2", "2->2.1", "2->2.1->2.1.1", "2->2.2", "3", "4"]

代码逻辑说明 #

1. 计算缩进层级：通过对比原字符串和去除开头空格后的字符串长度差，得到当前元素的缩进层级。
2. 调整层级栈：如果当前层级比栈的深度小，说明需要回退到上一级（比如从三级节点回到二级节点），弹出栈顶元素直到栈的深度和当前层级匹配。
3. 生成路径：如果栈为空（当前是顶级节点），路径就是节点本身；否则取栈的最后一个元素（父级的完整路径）拼接当前节点文本。
4. 更新结果和栈：把当前路径加入结果数组，同时推入栈中作为下一级节点的父级路径。

测试复杂场景 #

这个方案能轻松处理层级回退、多层嵌套的情况，比如：

const complexData = [ "1", " 1.1", "  1.1.1", " 1.2", "  1.2.1", "2", " 2.1", "3" ];
console.log(convertToHierarchyPaths(complexData));
// 输出：["1", "1->1.1", "1->1.1->1.1.1", "1->1.2", "1->1.2->1.2.1", "2", "2->2.1", "3"]

内容的提问来源于stack exchange，提问作者XTRUST.ORG