js 预编译 GO与AO 变量和函数声明提升

预编译

预编译分为全局（GO）预编译和局部（AO）预编译，全局预编译发生在页面加载完成时执行，而局部预编译发生在函数执行的前一刻。

js运行三步曲

首先JavaScript的执行过程会先扫描一下整体语法语句，如果存在逻辑错误或者语法错误，那么直接报错，程序停止执行，没有错误的话，开始从上到下解释一行执行一行。

1 语法分析
2 预编译
3 解释执行

局部预编译（AO）的4个步骤

1. 在执行的前一刻会创建一个ao对象
2. 将函数内所有的形参和变量声明储存到ao对象中，value为undefined；
3. 将形参和实参进行统一。
4. 将所有的函数声明的函数名作为ao对象中的key，函数整体内容作为value

全局预编译（GO）的3个步骤

1.　创建GO（Global Object）对象；
2.　寻找变量声明作为GO的属性名，并赋值为undefined；
3.　寻找函数声明，放入作为GO的属性，并赋值为其函数体。

由于全局中没有参数的的概念，所以省去了实参形参相统一这一步。

注意

函数提升只会提升函数声明，而不会提升函数表达式
函数声明：function fun(){}
函数表达式：var fun1=function(){}

例子AO

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// 函数
function fn(a){
console.log(a);
// 变量声明+变量赋值（只提升变量声明，不提升变量赋值）
var a = 123;
console.log(a);
// 函数声明
function a(){};
console.log(a);
// 函数表达式
var b = function(){};
console.log(b);
// 函数
function d(){};
}
//调用函数
fn(1);

步骤
1 创建AO对象

AO{}

2 找形参和变量声明，将形参名和变量名作为AO对象的属性名

AO{
a : undefined,
b : undefined
}

3 将实参值和形参统一

AO{
a : 1,
b : function(){…}
}

4 在函数体里面找函数声明，值赋予函数体。

AO{
a : function a(){…},
b : undefined,
d : function d(){…}
}

结果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 函数
function fn(a){
console.log(a);
//根据AO对象中的数据第一个打印的是：fn()
// 变量声明+变量赋值（只提升变量声明，不提升变量赋值）
var a = 123;
// 执行到这时，由于变量赋值是不提升的，所以函数被123覆盖了
console.log(a);
// 123
// 函数声明
function a(){};
// 这里被提升上去了，可以忽略
console.log(a);
// 123
// 函数表达式
var b = function(){};
console.log(b);
// 根据AO对象中的数据：fn()
// 函数
function d(){};
}
//调用函数
fn(1);

最后

以上就是明亮泥猴桃最近收集整理的关于js 预编译 GO与AO 变量和函数声明提升的全部内容，更多相关js内容请搜索靠谱客的其他文章。