携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第3天，点击查看活动详情

Babel的AST

回想babel编译的3个过程，首先是parse，目的是将代码转换成AST，然后是transform，根据需求，对AST进行增删改，最后generate则是根据修改后的AST生成我们所需要的目标代码。可以看到的，整个编译过程都是以AST为核心进行的。

AST叫做抽象语法树，它抽象的点在于它并不是完完全全对应源代码的，而是会省略点一些东西，比如说分隔符、代码注释这些东西是不会出现在AST里面的。

AST的标准： JS parser 出来的AST遵循 estree 标准；

常见的AST节点

字面量（Literal）

指的是 let a = 'hello' 中的 'hello' 这部分就是字面量，这里的是字符串字面量，代码中的字面量很多，babel 就是通过 xxLiteral 来抽象这部分内容的。

类型	名称	示例
StringLiteral	字符串字面量	'hello'
TemplateLiteral	模板字符串字面量	`hello`
NumbericLiteral	数字字面量	1、-1、999
RegExpLiteral	正则表达式字面量	/^[a-z]+/
BooleanLiteral	布尔字面量	True、False
BigintLiteral	大数字面量	1.23423n
NullLiteral	Null字面量	null

标识符（Identifier）

标识符指的是：变量名、属性名、参数名等各种声明和引用的名字。

JS中的标识符只能包含 数字、字母、下划线（_）、美元符号（$）且不能以数字开头。

const name = 'guang';

function say(name) {
  console.log(name);
}

const obj = {
  name: 'guang'
}

上面这段代码中，一共有8个标识符，分别是：

1. const声明的name变量；
2. 普通函数的函数名say；
3. 函数say的形参名称name；
4. 对象名称console；
5. console对象的方法名log；
6. log方法的参数名name；
7. const声明的对象名obj；
8. obj对象的属性名称name；

console 对象不是JavaScript的原生对象，它是宿主对象（在Web端就是指浏览器）提供的内置对象。用于访问调试控制台，不同浏览器的console效果可能会不一样。