前端知識點突破之：變量提高 - 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)
    }
}
複製代碼