做演示的时候，我们常会用图表来解释复杂概念。比如讲一段程序怎么运行，光靠口头描述容易让人迷糊。这时候，画一棵“语法树”就特别管用——它像家谱一样，把代码的结构一层层拆清楚。
什么是语法树
语法树，也叫抽象语法树（AST），是代码的一种可视化结构。它不关心具体写法，只关注“谁是谁的组成部分”。比如你写了一个算式 2 + 3 * 4，虽然看起来是一行字，但计算机不会从左到右硬算，而是先理解结构：乘法优先，所以 3 * 4 是一个整体，再和 2 相加。
这个结构可以用树来表示：
+
/ \
2 *
/ \
3 4顶部的 + 是根节点，代表最后做的操作；* 是它的右子节点，说明这部分要先算。这样一画，逻辑立马清晰。
为什么做演示需要了解它
在准备技术类PPT时，很多人直接贴一段代码，观众往往抓不住重点。如果你能把关键逻辑转成语法树展示，相当于把“黑箱”打开了。比如讲解一个条件判断语句：
if (score > 60) {
console.log('及格');
}它的语法树长这样：
if
/ \
> log
/ \
score 60左边是判断条件，右边是执行动作。观众一眼就能看出程序的“决策路径”，比读代码快得多。
实际应用场景
写插件、做代码转换工具的人常用语法树。比如你想批量把旧代码里的 var 换成 let，直接字符串替换可能出错（万一变量名里也有 var 呢？）。但通过解析成语法树，就能精准定位声明语句，安全替换。
再比如，有些在线代码格式化工具，粘进去一团乱码，出来规规矩矩。它们也是先把代码转成语法树，再按规则重新输出结构。
哪怕你不写代码，只要在演示中涉及程序逻辑，掌握这个概念，画图时就能更准、更快地传达核心思想。