## 如何使用 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