## 如何使用 JavaScript 实现一门编程语言(5) —— AST
在计算机科学中,抽象语法树(Abstract Syntax Tree,AST),或简称语法树(Syntax tree),是源代码语法结构的一种抽象表示。它以树状的形式表现编程语言的语法结构,树上的每个节点都表示源代码中的一种结构。
之前我们讲过,parser将构建一个忠实地表示程序语义的数据结构。这里的AST节点则是一个普通的JavaScript对象,它具有一个type属性,用于指定它是什么类型的节点,还有一些附加信息,附加信息的值可能因 type 而异。
下面是我们语言所有 AST 节点列表:
```
[
/**
* 数字(num)
* 比如: 123.5
*/
{ type: "num", value: 123.5 },
/**
* 字符串(str)
* 比如: "Hello World!"
*/
{ type: "str", value: "Hello World!" },
/**
* 布尔值(bool)
* 比如: true、false
*/
{ type: "bool", value: true },
{ type: "bool", value: false },
/**
* 标识符(var)
* 比如: x
*/
{ type: "var", value: "x" },
/**
* 函数表达式(lambda or λ)
* 比如: lambda (x) 10 或者 λ (x) 10
*/
{
type: "lambda",
vars: ["x"],
body: { type: "num", value: 10 }
},
/**
* 函数调用(call)
* 比如:foo(a, 1)
*/
{
type: "call",
func: { type: "var", value: "foo" },
args: [
{ type: "var", value: "a" },
{ type: "num", "value": 1 }
]
},
/**
* 条件语句(if)
* 比如:if foo then bar else baz
*/
{
type: "if",
cond: { type: "var", value: "foo" },
then: { type: "var", value: "bar" },
else: { type: "var", value: "baz" }
},
// 注:else分支是可选的
// 比如:if foo then bar
{
type: "if",
cond: { type: "var", value: "foo" },
then: { type: "var", value: "bar" }
},
/**
* 赋值表达式(assign)
* 比如:a = 10
*/
{
type: "assign",
operator: "=",
left: { type: "var", value: "a" },
right: { type: "num", value: 10 }
},
/**
* 二元表达式(binary)
* 比如:x + y * z
*/
{
type: "binary",
operator: "+",
left: { type: "var", value: "x" },
right: {
type: "binary",
operator: "*",
left: { type: "var", value: "y" },
right: { type: "var", value: "z" }
}
},
/**
* 表达式序列(prog)
* 比如:
* {
a = 5;
b = a * 2;
a + b;
}
*/
{
type: "prog",
prog: [{
type: "assign",
operator: "=",
left: { type: "var", value: "a" },
right: { type: "num", value: 5 }
},
{
type: "assign",
operator: "=",
left: { type: "var", value: "b" },
right: {
type: "binary",
operator: "*",
left: { type: "var", value: "a" },
right: { type: "num", value: 2 }
}
},
{
type: "binary",
operator: "+",
left: { type: "var", value: "a" },
right: { type: "var", value: "b" }
}]
}
]
```
- Web 开发笔记
- 从输入 URL 到页面加载完成的过程中都发生了什么事情?
- 从浏览器接收url到开启网络请求线程
- 开启网络线程到发出一个完整的http请求
- 从服务器接收到请求到对应后台接收到请求
- 后台和前台的http交互
- http的缓存
- 解析页面流程
- HTML解析,构建DOM
- CSS解析,构建CSSOM
- 资源外链的下载
- CSS的可视化格式模型
- 包含块(Containing Block)
- 控制框(Controlling Box)
- BFC(Block Formatting Context)
- IFC(Inline Formatting Context)
- 其它
- JS引擎解析过程
- JS的解释阶段
- JS的预处理阶段
- JS的执行阶段
- 回收机制
- 参考资料
- JavaScript模块化编程
- AMD
- requireJS
- CommonJS
- UMD
- ES6模块
- 参考资料
- 使用 JavaScript 实现一门编程语言
- 如何使用 JavaScript 实现一门编程语言(1) —— 前言
- 如何使用 JavaScript 实现一门编程语言(2) —— 编写一个解析器
- 如何使用 JavaScript 实现一门编程语言(3) —— Input stream
- 如何使用 JavaScript 实现一门编程语言(4) —— Token stream
- 如何使用 JavaScript 实现一门编程语言(5) —— AST
- 如何使用 JavaScript 实现一门编程语言(6) —— Interpreter
- 完整代码
- 参考资料
- 前端布局概论
- 参考资料
- Windows 笔记
- 错误解决
- win10应用商店无法登录提示0x80070426解决方法
- 使用技巧
- 设置 Hyper-V 和 VMware 共存
- Powershell
- WSL