一、前言

　　babel在大家的工作中應該沒少用，但是為什麽它能將ES6轉成ES5呢？一個有態度的前端er肯定會想拋開迷霧，看看其中的奧秘。

　　記得很早前自己有去了解過相關方面的內容，但是時間久遠，現在已是很模糊了。在此寫點筆記回顧一下。

二、運行原理

　 抽象語法樹（AST）

　　　　抽象語法樹（abstract syntax tree或者縮寫為AST），或者語法樹（syntax tree），是源代碼的抽象語法結構的樹狀表現形式，這裏特指編程語言的源代碼。 和抽象語法樹相對的是具體語法樹（concrete syntaxtree），通常稱作分析樹（parse tree）。 一般的，在源代碼的翻譯和編譯過程中，語法分析器創建出分析樹。一旦AST被創建出來，在後續的處理過程中，比如語義分析階段，會添加一些信息。

　　靜態分析

　　 　　1、靜態分析是在不需要執行代碼的前提下對代碼進行分析的處理過程 （執行代碼的同時進行代碼分析即是動態分析）。

　　 　　2、靜態分析的目的是多種多樣的， 它可用於語法檢查，編譯，代碼高亮，代碼轉換，優化，壓縮等等場景。

　　babel工作分為三大階段

　　1、解析

　　　　將代碼字符串解析為抽象語法樹；

　　　　將整個代碼分割成語法單元，進而再分析語法單元之間的關系；

　　　　這一步會驗證語法的正確性，同時由字符串變為對象結構後更有利於精準地分析以及進行代碼結構調整。

　　2、轉換

　　　　遍歷抽象樹，對抽象語法樹進行再變換；　這一步是babel或者其他編譯器中最為復雜的過程。

　　3、生成

　　　　遞歸變換後的抽象語法樹再生成代碼字符串；

三、後話

　　上面只是簡述babel工作流程，詳細每一步的過程可以看後面的參考文章，寫得很詳細。

　　其實也沒有特別高程莫測的原理，主要還是寫一個語法解釋器需要不少的功夫。

參考：

https://zhuanlan.zhihu.com/p/27289600

https://segmentfault.com/a/1190000008390268

回頭再看看babel的實現原理