前端工具和框架的迭代速度非常快,要想追赶前端工具和框架的更新速度,必须抓住本质的知识。要彻底了解 JavaScript、Babel、Eslint、Vue、React等框架的实现机制,必须搞清楚一些基本概念。比如编译器(Compiler)、解释器(Interpreter)、抽象语法树(AST)、字节码(Bytecode)、即时编译器(JIT)。
编译型语言在程序执行之前,需要经过编译器的编译过程,并且在编译之后会直接保留机器能读懂的二进制文件,这样每次运行程序时,都可以直接运行该二进制文件,而不需要再次重新编译了。
而解释型语言编写的程序,在每次运行时都需要通过解释器对程序进行动态解释和执行。
V8 在执行过程中既有解释器 Ignition,又有编译器 TurboFan。
高级语言是开发者可以理解的语言,但是让编译器或者解释器来理解就非常困难了。对于他们来说,能理解的就是 AST 了。这和渲染引擎将 HTML 格式文件转换为 DOM 树的情况类似。
AST 是一个非常重要的数据结构,Babel、Eslint 都是利用 AST 进行代码转译和规范的。
第一阶段是分词(tokenize),又称词法分析。所谓 token,就是语法上不可能再分的、最小的单个字符或字符串。
第二阶段是解析(parse),又称语法分析。将上一步生成的 token 数据,根据语法规则转换为 AST。
有了 AST 和执行上下文,解释器 Igniton 会根据 AST 生成字节码,并解释执行字节码。
一开始 V8 是没有字节码的,而是直接将 AST 转换为机器码,但是机器码占用的内存特别高,在手机上使用非常不方便。于是 Chrome 总结了现在的这样一套架构。
字节码就是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关,字节码需要通过解释器将其转换为机器码后才能执行。
在解释器逐行解释执行字节码的过程中,如果发现一段代码被重复执行多次,这种代码叫做热点代码。解释器会将这段热点代码编译为高效的机器码。
字节码配合解释器和编译器是一种叫做**即时编译(JIT)**的技术,应用广泛。