js代码预解析原理逐步分析
js是一个解释型的语言,就是在代码执行之前,先对代码进行通读和解释,然后再执行代码,把对代码进行通读和解释阶段称之为代码预解析。
1、需要解释的内容有两个:
1)声明式函数:在内存中先声明一个变量名是函数名,并且这个名字代表的内容是一个函数。
2)关键字:在内存中声明有一个变量名,不赋值 *注意:不会把变量的值预解析。
2、例题1:
fn();
console.log(num);
function fn(){
console.log('我是fn函数')
}
var num = 100;
//这段代码分析过程,两个阶段
//第一个阶段是预解析
function fn(){
console.log('hello word')
}//函数是一等公民
var num //注意:预解析不会把num=100;解析到;
//第二个阶段是代码执行
fn();//函数调用才会执行函数,这个时候控制台会输出//'hello word'
console.log(num);//预解析时只声明了有一个变量num,所以控制台输出的结果是undefined,
num = 100;//最后才是执行到给num赋值;
例题2、
console.log( func );
var func = 123;
console.log( func );
function func() {
console.log( 'Hello js' );
}
//第一个阶段是预解析,如果同名且变量未赋值时,函数是一等公民,
var func;
function func() {
console.log( 'Hello js' );
}
//第二个阶段是代码执行
console.log( func );//输出结果为func()函数所有的代码
func = 123;//对变量func赋值,此时的func()会被func覆盖,与css层叠一样,书写在后面的会生效
console.log( func );//输出的结果为123
例题3:
myFun(10, 20);
var myFun = function(a, b) {
return a + b;
}
//第一个阶段是预解析,
var myFun;//注意:这个函数是一个赋值式的函数,预解析只是解析了一个叫做myFun的变量名;
//第二个阶段是代码执行
myFun(10, 20);//函数写在调用后面,且是赋值式的,不会被预解析到,所以此时调用函数会报错,系统会提示: myFun is not a function,myFun 不是一个函数
注意:
1、只有声明式函数才可以预解析到,以赋值式函数不会被解析到。
2、变量在预解析时只是解析到存在一个变量名,此时是没有值的。