JavaScript中预编译是怎么进行的
今天小编给大家分享一下JavaScript中预编译是怎么进行的的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。
引入
在代码执行前，编译器会进行如下操作：
一 parse阶段
分词。就是将代码分成原子符号(token)
将token解析翻译成AST(语法生成树)。
二 analyze阶段
遇到声明语句，将会把声明传到作用域(scope)中创建绑定，分配内存并将变量默认设为undefined或函数体。
然后就可以执行代码啦，执行中途每次遇到赋值或者取值，都会从作用域中查找绑定。这样看，是不是有点"预编译"内味了?但是实际上还是称它为预处理更加贴切一点。接下来，让我们来了解一波看起来最像预编译的操作--第三步的干货。
"预编译"
我的老师在和我讲相关知识点前和我说过这么一个笑话：
面试时我因为这么一个问题挂了
var a = 100 function foo(){ console.log(a) } foo()问：为什么输出a的值是100?
答：因为100赋值给了a。
老师说完我头昏脑涨，完全不明白笑点在哪，后来才知道这是在考察"预编译"这方面的知识。
总的来说，"预编译"可以分为
创建GO对象(global object) 发生在页面加载完成时
创建AO对象(activation object) 发生在函数执行前一刻
具体步骤如下：
全局预编译
1. 创建GO对象
2. 找变量声明，将变量声明作为GO对象的属性名，并赋值undefined
3. 找全局里的函数声明，将函数名作为GO对象的属性名，值赋予函数体
局部预编译
1. 创建一个AO对象
2. 找形参和变量声明，将形参和变量声明作为AO对象的属性名，值为undefined
3. 将实参和形参统一
4. 在函数体里找函数声明，将函数名作为AO对象的属性名，值赋予函数体
所以那个笑话里的面试问题我们应该这么回答：
首先，编译器创建一个GO对象
找到变量声明 var a
和函数声明 function foo(){}
将上面两个变量声明作为GO的属性名赋初值
GO{
a:undefined
foo:function(){}
}
然后运行第一行代码 a=100
在GO中将100赋值给a
再执行第五行代码运行foo函数
创建一个AO对象
在函数体内找变量声明和形参，(无)
再在函数体内找函数声明(无)
所以
AO{
}
完成后运行第三行代码，输出a
先在AO对象中寻找a的值，发现不存在，向外部作用域扩展，在GO对象中寻找a，发现a的值为100
输出100
当然，笑话里的题过于简单，但是能让我们清晰的了解到这个"预编译"的进行
下面，我们来看一道面试题简化版，练练手：
global = 100 function fn() { console.log(global); global = 200 console.log(global); var global = 300 } fn()它的逻辑和输出结果是多少呢?通过一步步的分析我们可以知道具体的分析应该是这样的：
GO: { global: undefined => 100, fn: function() {} } global = 100 // 没有声明的变量默认为全局变量，也会放到GO中 function fn() { console.log(global); // 输出undefined global = 200 console.log(global); // 输出200 var global = 300 } AO: { global: undefined => 200 => 300 } fn()以上就是"JavaScript中预编译是怎么进行的"这篇文章的所有内容，感谢各位的阅读！相信大家阅读完这篇文章都有很大的收获，小编每天都会为大家更新不同的知识，如果还想学习更多的知识，请关注行业资讯频道。
