编译技术是一门庞大的学科,我们无法对其做完善的讲解。但不同用途的编译器或编译技术的难度可能相差很大,对知识的掌握要求也会相差很多。如果你要实现诸如 C、JavaScript 这类通用用途语言(general purpose language),那么就需要掌握较多编译技术知识。例如,理解上下文无关文法,使用巴科斯范式(BNF),扩展巴科斯范式(EBNF)书写语法规则,完成语法推导,理解和消除左递归,递归下降算法,甚至类型系统方面的知识等。但作为前端工程师,我们应用编译技术的场景通常是:表格、报表中的自定义公式计算器,设计一种领域特定语言(DSL)等。其中,实现公式计算器甚至只涉及编译前端技术,而领域特定语言根据其具体使用场景和目标平台的不同,难度会有所不同。Vue.js 的模板和 JSX 都属于领域特定语言,它们的实现难度属于中、低级别,只要掌握基本的编译技术理论即可实现这些功能。
1、模板 DSL 的编译器
编译器其实只是一段程序,它用来将“一种语言 A”翻译成“另外一种语言 B”。其中,语言 A 通常叫作源代码(source code),语言 B 通常叫作目标代码(object code 或 target code)。编译器将源代码翻译为目标代码的过程叫作编译(compile)。完整的编译过程通常包含词法分析、语法分析、语义分析、中间代码生成、优化、目标代码生成等步骤,如下图所示:
可以看到,整个编译过程分为编译前端和编译后端。编译前端包含词法分析、语法分析和语义分析,它通常与目标平台无关,仅负责分析源代码。编译后端则通常与目标平台有关,编译后端涉及中间代码生成和优化以及目标代码生成。但是,编译后端并不一定会包含中间代码生成和优化这两个环节,这取决于具体的场景和实现。中间代码生成和优化这两个环节有时也叫“中端”。