预编译超详细讲解

43 阅读 0 评论 29 点赞

我是靠谱客的博主傲娇绿草，最近开发中收集的这篇文章主要介绍预编译超详细讲解，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

什么是预编译？
当js代码执行时有三个步骤：
1、语法分析，这个过程检查出基本的语法错误。
2、预编译，为对象分配空间。
3、解释执行，解释一行执行一行，一旦出错立即停止执行。

在执行代码前，还有两个步骤
语法分析很简单，就是引擎检查你的代码有没有什么低级的语法错误
解释执行顾名思义便是执行代码了
预编译简单理解就是在内存中开辟一些空间，存放一些变量与函数

JS预编译什么时候发生？
预编译在script代码内执行前发生了
但是它大部分会发生在函数执行前
预编译一共有两种，一种是相对于调用函数而言的预编译，一种是在全局中的预编译
全局变量在全局都拥有定义，而局部变量只能在函数内有效
执行期上下文，英文名Activation Object，简称AO
全局对象，英文名Global Object，简称GO
AO和GO都是一种对象
预编译发生在JS代码执行前，同时大部分发生在函数执行前
函数执行前会进行预编译，产生AO
全局变量在执行前也会有预编译，产生GO

预编译的步骤
创建 AO( Activation Object ) 对象；
找形参和变量声明，将形参和变量名作为 AO 对象的属性名，值为 undefined；
将形参与实参值统一（用实参的值替换 undefined） (这一步是相对于调用函数而言，若直接在全局中可忽略)；
在函数体中找函数声明，将函数名添加到 AO 对象的属性中，值为函数体（如属性名重复，则覆盖前面）。

1、任何未经声明就赋值的变量，都是全局变量
2、预编译过程中，只是对函数声明的整体提升，对于函数体里边的具体内容，不会进行查看。函数执行的时候，才会去看函数里的具体内容

就以上内容分享一个小例子叭~
function fn(a) {
console.log(a); // function a() {}
var a = 123;
console.log(a); // 123 这时的 AO 对象变成
AO = {
a: 123,
b: undefined,
d: function d() {}
}
function a() {}
console.log(a); // 123
var b = function() {} // 这时的 AO 对象变成
AO = {
a: 123,
b: function() {},
d: function d() {}
}
console.log(b); // function() {}
function d() {}
console.log(d); // function d() {}
}