前端知识点突破之：变量提升 - JavaScript预解析

话不多说，直接开干

什么是“预解析”？

定义：将 var 和 function 声明的变量，提升到当前作用域的最顶部，事先声明，然后再开始从上到下的执行js代码。

• 例1：

console.log(a);
var a = 1;

上面这个例子，估计大家都知道，打印的 a 为 undefined

原因：var 声明的变量会提升到最前面，也就是说以下才是真实的js加载顺序

var a;
console.log(a);
a = 1;

也就是说，a先被声明之后，再打印，此时的 a 的值就是 undefined 了

• 例2：

if(false){
    var a = 10
}
console.log(a)

这个例子拿到的 a 的值也是 undefined 。明明 if 语句里面的代码没有执行，但依然打印出 undefined ，说明 var 声明的变量，不管在什么地方，在加载js的时候，会将其直接提升到当前作用域的最顶部去声明，然后才开始真正的走你写的代码

结论：

变量提升：就是将 var 和 function 声明的变量，提升到当前作用域的最顶部，事先声明，然后再开始从上到下的执行js代码

• 注意：是 var 和 function 声明的变量，才会有变量提升

那么问题来了， var 和 function 声明的变量谁先谁后呢

var 和 function的区别

• 例子：3

function add(){
    console.log(2345)
}
var add;
console.log(add)

其实这一个例子就能看出来，打印的值是 f add(){console.log(2345)}

结论：

1. js在预解析的时候， function 声明的变量，会覆盖 var 声明的变量
2. function ，不但声明了变量，而且定义了变量的内容（因为刚刚的add打印的是 f add(){console.log(2345)} ，而不是 function(){} ）

测试题

题1：

function add(){
    var b;
    console.log(a)
    return;
    function a(){
        console.log(b)
    }
}