编译器(Compiler
),解释器(InterPerter
),抽象语法树(AST
),字节码(ByteCode
),即时编译器(JIT
)。
文章图片
- 生成抽像语法树和执行上下文。
AST
用于babel
,先将ES6
转为AST
,再将ES6
的AST
转为ES5
的AST
,最后利用ES5
的AST
生成JS
源代码。
生成AST
2个阶段:(1)分词(词法分析)将源码拆成token
。var myName='思否'
。关键字var
、标识符myName
、赋值运算符=
、字符串思否
都是token
。(2)解释(语法分析)将token
根据语法规则转成AST
,先分词再解释。有了AST
就会成为可执行上下文。 - 生成字节码,有了
AST
和执行上下文,解释器Ignition
就会根据AST
生成字节码并解释执行字节码。一开始V8
是直接将AST
转为机器码的,因为机器码执行效率高,但是占内存,后来才引入了字节码。字节码是介于AST
和机器码之间的一种代码字节码需要通过解释器转成机器码才能执行。 - 执行代码,第一次执行字节码,解释器(
Ignition
)会逐条解释执行,如果有被执行多次的代码,编译器TurboFan
会把这段代码编译为机器码,并把编译后的机器码保存起来。当再次执行这段代码时,只用执行保存的机器码就行了。提升了执行效率,执行时间越久重复执行代码越多,被保存的编译机器码越多,不用编译就越快。被称为即时编译:字节码+解释器+编译器。
var myName='思否';
function foo(){ return 23 };
myName='segmentfault';
foo();
【浏览器工作原理与实践(三)】编译后:
文章图片
推荐阅读
- JS系列(认识迭代器和可迭代对象)
- Vue|ES6学习——一文搞懂ES6
- #|ES6 对象——扩展运算符、对象新方法
- 笔记|电话面试-----海康威视
- javascript|JavaScript面试题看这一篇就够了,简单全面一发入魂(持续更新 step2)
- 笔记-javascript事件循环
- JavaScript比较日期
- JavaScript try-catch语句
- JavaScript中的异常处理