JS学习总结-----JavaScript的预解析

JavaScript代码是由浏览器中JS引擎来执行的，js引擎在运行js代码的时候分为两个步骤：预解析和代码执行。(代码的执行是从上往下的)

1.预解析js引擎会把js里面所有的 var   function 提升到当前作用域的最前面。

2.预解析分为 变量预解析和函数预解析。也称为变量提升和函数提升。

（1）变量的预解析就是把代码中的变量声明提升到当前的作用域最前面，注意赋值操作不提升。

（2）函数的预解析就是把代码中的函数声明提升到当前的作用域最前面，不调用函数。

预解析案例一 结果是 ？

<script>
var num = 123;
fn1();
function fn1() {
console.log(num);
var num = 456;
}
//进行预解析相当于进行了如下操作
//var = num;
//function fn1() {
//var = num;
//console.log(num);
//num = 456;
//}
//num = 123;
//fn1();
</script>

运行截图:

 

为什么结果是 undefined ? 因为根据作用域链的就近原则，在函数fn1()中，声明变量会提升，而代码的执行是从上往下的，只有一个num ,没有被赋值。因此是undefined。

 预解析案例二 结果是 ？

<script>
var num = 123;
function fn2() {
console.log(num);
var num = 456;
console.log(num);
}
fn2();
//进行预解析相当于进行如下代码
//var num;
//function fn2() {
//var num;
//console.log(num);
//num = 456;
//console.log(num);
//}
//fn2();
</script>

运行截图：

 预解析案例三 结果是 ？

<script>
fn3();
console.log(c);
console.log(b);
console.log(a);
function fn3() {
var a = b = c = 123;
console.log(a);
console.log(b);
console.log(c);
}
//进行预解析相当于进行如下代码
//function fn3() {
//var a;
//a = b = c = 123;
//console.log(a);
//console.log(b);
//console.log(c);
//}
//fn3();
//console.log(c);
//console.log(b);
//console.log(a);
</script>

 运行截图；

 注意 var a = b = c = 123; 相当于var a = 123; b = 123; c = 123; （其中b和c是直接赋值 没有var声明 当全局变量。 而集体声明是var a = 123， b = 123， c = 123;

 为什么打印的最后一个会报错呢？

因为var = a ;是声明在fn3()函数中属于局部变量 ，则打印最后一个报错。