0
点赞
收藏
分享

微信扫一扫

【前端基础知识】JavaScript 预编译,刚接触前端的赶紧学起来,否则“命途多舛”

预编译

全局预编译(GO)

GO例题:
console.log(a);
a = 100;
function a() { };
console.log(a);
var a;
题解:

1、创建GO对象(Global Object)全局对象。

//创建GO对象(Global Object)全局对象。
GO{}

2、找变量声明,将变量名作为GO属性名,值为undefined。

//找变量声明,将变量名作为GO属性名,值为undefined
GO{
	a:undefined, //只有var a 这个变量声明
}

3、查找函数声明,作为GO属性,值赋予函数体。

//查找函数声明,作为GO属性,值赋予函数体
GO{
	a:function a() { },//函数声明将变量a替换掉了
}
//题解:
console.log(a);//function a() { }:预编译
a = 100;
function a() { };
console.log(a);//100:因为a = 100进行赋值
var a;

局部预编译(AO)

AO例题:
//例题:
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对象
AO{}

2、找形参和实参声明,将形参和实参名作为AO对象的属性,值为undefined。

//找形参和实参声明,将形参和实参名作为AO对象的属性,值为undefined。
/*
形参:a
实参:a、b
*/
AO{
	a:undefined,
	b:undefined
}

3、将实参值和形参统一

//将实参值和形参统一
AO{
	a:1,
	b:undefined
}

4、在函数体里面找到函数声明,赋值予函数体

//在函数体里面找到函数声明,赋值予函数体
/*
函数声明:function a(){}、function d(){}
*/
AO{
	a:function a(){},
	b:undefined,
	d:function d(){}
}

局部预编译完成!!

//题解:函数是在预编译完成后执行的
function fn(a){
    console.log(a);//function a(){}
    var a = 123;
    console.log(a);//123:a重新进行了赋值
    function a(){}
    console.log(a);//123:function a(){}在预编译的时候已经提前,这里没有重新赋值
    var b = function(){}
    console.log(b);//function(){}:在预编译中b的值为undefined,但是在上一行进行了赋值
    function d(){}
}

fn(1);

GO+AO例题

console.log(test);
console.log(a)
a = 100;//相当于定义了window.a;
function test(a) {
    console.log(a);
    function a() { }
    console.log(a);
    var a = 300;
}
test(a);
题解:

1、创建GO对象

GO{}

2、找变量声明,将变量名作为GO属性名,值为undefined。(本题没有声明变量)

GO{}

3、查找函数声明,作为GO属性,值赋予函数体。

GO{
	test:function test(a) {
	    console.log(a);
	    function a() { }
	    console.log(a);
	    var a = 300;
	}
}

GO预编译完成!!!

//全局解释执行后的结果
console.log(test);//function test(a) { console.log(a); var a = 200; console.log(a); var a = 300;}
console.log(a);//Uncaught ReferenceError: a is not defined(要执行test函数,后面讲AO的时候要删掉此行)
a = 100;//相当于定义了一个window.a;
function test(a) {
    console.log(a);
    function a() { }
    console.log(a);
    var a = 300;
}
test(a);

1、创建AO对象

AO{}

2、找形参和实参声明,将形参和实参名作为AO对象的属性,值为undefined。

AO{
	a:undefined
}

3、将实参值和形参统一

AO{
	a:100
}

4、在函数体里面找到函数声明,赋值予函数体

AO{
	a:function a() { }
}

局部编译完成!!!

//局部解释执行后的结果
console.log(test);//function test(a) { console.log(a); var a = 200; console.log(a); var a = 300;}
//console.log(a);//Uncaught ReferenceError: a is not defined(要执行test函数,后面讲AO的时候要删掉此行)
a = 100;//相当于定义了一个window.a;
function test(a) {
    console.log(a);//function a() { }
    function a() { }
    console.log(a);//function a() { }
    var a = 300;
}
test(a);
举报

相关推荐

0 条评论