编程基础篇 · 树与图：AI 的主场
树：Coding Agent 眼里全是它
前面几课的收纳方式都是「一排排」的，这一课换个维度：一层套一层的收纳。衣柜里有格子，格子里有盒子，盒子里有袋子——这种「层级 + 包含」的收纳方式，在编程世界叫「树」。而 Coding Agent 抬眼望去，你的项目里全是树。
一物三看 · 同一个项目，三棵树
假设你让 AI 帮你做一个「奶茶店小程序」。下面三个标签页，分别是这个项目的文件目录、一笔订单的 JSON 数据、点单页的网页 DOM——三样东西看着完全不同，请你点击带箭头的节点展开收起，留意一件事：它们的形状是不是一模一样？都是一个根往下分叉。
根：最顶上那个，全树只有一个
父 / 子：上一层是父，展开出来的是子
叶子：再也展不开的末端节点
只要有「层级 + 包含」关系，它就是树。文件夹包含文件、订单包含商品列表、页面包含卡片包含按钮——收纳逻辑完全一样。所以 Agent 学会「读树」这一门手艺，就能同时看懂你的项目结构、API 返回的数据和整个网页。顺便记三个术语：最顶上的叫根，有孩子的叫父节点，没孩子的末端叫叶子。就这三个，够用一辈子。
重头戏 · 一行代码变成一棵树
树最厉害的一次出场，是在代码本身。下面这行算总价的代码，在你眼里是一串文字，在 Coding Agent 眼里是一棵语法树（AST）。点「解析」，看它自下而上长出来——留意每一步高亮的代码片段，和树上新长出的节点是怎么对应的。
total=price*qty+fee
这行代码的意思：总价 = 单价 × 数量 + 配送费。点下面的「解析」，看 Agent 是怎么读它的。
动画约 5 秒，自下而上长出一棵树
这就是 Coding Agent 改代码精准的秘密。你说「把乘号右边的变量改成 quantity」，Agent 不是在一堆文字里搜「乘号」两个字——它在树上先找到
* 节点，再取它的右孩子，指哪打哪。改完再把树「打印」回文字，一个空格都不会错位。重命名变量、抽取函数、批量重构，靠的全是在这棵树上做手术，而不是碰运气的文本替换。
这和 AI 有什么关系？
Agent 读项目 = 从根遍历文件树
你把项目丢给 Coding Agent，它做的第一件事就是从根目录出发，一层层展开子文件夹——和你刚才点开「奶茶店小程序」目录的动作一模一样。它先看树的形状了解项目骨架，再挑几片关键的「叶子」细读。
JSON 是 API 世界的通用树
你调用大模型 API 时发的 message list、RAG 检索回来的资料、Agent 之间传的任务，几乎全打包成 JSON——因为它是一棵用文字写出来的树，任何程序都能一层层拆开读。看懂树，就看懂了 AI 世界一大半的数据。
✅ 这一课想和你分享的
- 层级即树：只要有「一层套一层」的包含关系，就是树——文件目录、JSON、DOM 全是
- 三个术语：最顶上叫根，有孩子的叫父节点，末端叫叶子
- AST 是 AI 精确改代码的地图：Agent 看的不是文字，是语法树，所以能指哪打哪
- Agent 读项目就是遍历文件树：从根出发一层层展开，先看骨架再读叶子
- JSON 是 API 世界的通用树：AI 世界的数据交换，大半靠这棵「文字树」