JavaScript 的 AST 是源代码的结构化内存表示，由解析器（如 @babel/parser 或 acorn）生成，被 Babel、ESLint 等工具用于遍历、检查和转换；它不含运行时值或作用域信息，操作需用专用 API 并配合 generate 产出代码。

JavaScript 的 AST（Abstract Syntax Tree，抽象语法树）不是某种运行时结构，而是源代码的内存中结构化表示——它把 function foo() { return 42; } 这样的文本，解析成带类型、位置、嵌套关系的 JavaScript 对象树。你无法在浏览器控制台直接打印出“AST 实例”，但所有现代 JS 工具链（Babel、ESLint、Prettier、TypeScript 编译器）都重度依赖它。

AST 是怎么生成的？用 acorn 或 @babel/parser 一试便知

AST 不是语言内置概念，而是解析器输出的结果。最直接的方式是用解析器把字符串转成树：

• @babel/parser 是最常用选择，支持最新语法（可选 JSX、TypeScript、flow），且输出格式稳定，插件生态成熟
• acorn 更轻量，V8 和 ESLint 早期都用它；但默认不支持装饰器、export type 等较新特性
• 不能直接用 JSON.stringify(ast) 全量查看——AST 对象含循环引用和大量元数据，建议用 ast-printer 或 astexplorer.net

const parser = require('@babel/parser');
const ast = parser.parse('const x = 1 + 2;', {
  sourceType: 'module',
  plugins: ['jsx']
});
console.log(ast.program.body[0].type); // 'VariableDeclaration'
console.log(ast.program.body[0].declarations[0].init.type); // 'BinaryExpression'

为什么 ESLint 能检测 for...in 循环？靠遍历 AST 节点类型

ESLint 规则不正则匹配字符串，而是监听特定 AST 节点类型。比如 no-for-in 规则会在遍历中捕获 ForInStatement 节点，再检查其左部是否为变量声明、右部是否为对象字面量等上下文。

• 每个节点有 type（如 CallExpression、ArrowFunctionExpression）、start/end（源码位置）、loc（行列号）
• 遍历用的是 traverse（Babel）或 estraverse（ESLint），不是递归写法——它们自动处理嵌套、跳过注释、保留作用域信息
• 误报常源于没判断节点上下文：比如只匹配 CallExpression 会把 console.log() 和 React.createElement() 一并抓到，必须加 node.callee.name === 'fetch' 等条件

Babel 插件怎么把 class 编译成 function？修改 AST 节点并重新生成代码

Babel 的核心三步：parse → transform → generate。transform 阶段就是读取 AST、修改节点、返回新 AST。例如将 class A { m() {} } 转为函数声明，本质是：

• 找到 ClassDeclaration 节点
• 新建一个 FunctionDeclaration 节点，把类名、方法体、构造函数逻辑塞进去
• 用 path.replaceWith() 替换原节点
• 最后 @babel/generator 把改完的 AST 变回字符串

注意：不能手动拼接字符串替换，否则丢失 sourcemap、缩进、注释位置；也不能直接改 node.type = 'FunctionDeclaration'——节点类型不可变，必须用 Babel 提供的 builder 函数（如 t.functionDeclaration()）创建新节点。

AST 操作容易忽略的三个现实约束

实际写 codemod 或自定义 lint 规则时，以下几点常导致失败或行为异常：

• AST 不包含作用域求值结果：你无法从 const x = Math.random(); 的 AST 中知道 x 的值，也无法判断 foo.bar 是否真有 bar 属性——那是 TypeScript 或 ESLint 的 scope analyzer / type checker 干的事
• 不同解析器输出结构不兼容：@babel/parser 和 acorn 的 ObjectExpression 节点字段名一致，但 estree 规范未强制要求所有字段，Babel 还额外加了 extra.parenthesized 等私有字段
• 修改 AST 后必须调用 generate() 才能拿到代码：仅操作 AST 对象不会改变原始字符串，也不会触发重编译——这看似废话，但很多初学者卡在“改了 AST 却没看到输出变化”