如何基于给定数组在控制台绘制带分支结构的二叉树？

针对你用递归只能输出缩进列表的问题，核心是在递归时跟踪每个节点的分支上下文——要知道当前节点是父节点的最后一个子节点还是非最后一个，以此输出对应的竖线（│）、空格或分支符号（├─/└─）。

完整实现代码 #

// 输入格式：二叉树用嵌套数组表示，[根节点, 左子树, 右子树]，无子树则省略或传undefined
function printBinaryTree(tree, prefix = '', isLast = true) {
  if (!tree || tree.length === 0) return;
  
  // 取出节点值和左右子树
  const [nodeVal, left, right] = tree;
  
  // 打印当前节点的分支和值
  console.log(`${prefix}${isLast ? '└─' : '├─'} ${nodeVal}`);
  
  // 计算子节点的前缀：如果是最后一个节点，后面的分支用空格占位；否则用竖线保持分支连贯
  const childPrefix = `${prefix}${isLast ? '   ' : '│  '}`;
  
  // 递归处理子树：注意右子树是父节点的最后一个子节点（如果存在）
  if (left) printBinaryTree(left, childPrefix, !right);
  if (right) printBinaryTree(right, childPrefix, true);
}

// 测试用例
const testTree = [1, [2, [4], [5, [7], [8]]], [3, [6]]];
printBinaryTree(testTree);

输出效果 #

└─ 1
   ├─ 2
   │  ├─ 4
   │  └─ 5
   │     ├─ 7
   │     └─ 8
   └─ 3
      └─ 6

关键逻辑说明 #

1. 分支符号控制：
   • 非最后一个子节点用├─，最后一个用└─
   • 子节点的前缀根据父节点是否为最后一个决定：父节点非最后时，子节点前缀保留│ 来维持竖线分支；父节点是最后时，用 空格占位，避免多余分支线
2. 递归上下文传递：通过prefix参数传递当前节点之前的分支符号，isLast标记当前节点是否为父节点的最后一个子节点，确保分支线的连贯性
3. 兼容空节点：判断tree是否为空或undefined，避免递归报错

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