變量提升和函數(shù)提升基本上是面試必問題目
//先從一個面試題說起
console.log(a)
if (a) {
var a = 1;
console.log(a)
}
function a() {
console.log(this);
}
console.log(a);
a()
下面我們針對這個栗子解析一下
我們知道變量和很熟定義都會提升到作用域最前邊
唯一需要確認的是變量和函數(shù)的先后順序
我們預想 函數(shù)是用第一公民會不會提升到最前邊呢萧朝？
//如果是解析完順序是這樣的
function a() {
console.log(this);
}
var a;
console.log(a)
if (a) {
a = 1;
console.log(a)
}
console.log(a);
a()
按照我們預想的解析結果應該是
// undefined
// undefined
// 報錯
理由 函數(shù)在上var在下桩砰，第一個console時a未賦值，其結果是undefined，if為false 只剩最后一個console也是undefined 最后a is not a function.
不過結果是
image.png
我機智的認為 預想錯了雄坪？
//再次測試
var a;
function a() {
console.log(this);
}
console.log(a)
if (a) {
a = 1;
console.log(a)
}
console.log(a);
a()
這樣？對比一下結果
人工解析結果 ：
1椭员、a()
2雨涛、1
3、1
4赶么、a() 報錯
瀏覽器執(zhí)行結果：
image.png
沒毛布缁怼！
看到這里一切完美辫呻，不過我還是重新搜索了一些高質量文章清钥，發(fā)現(xiàn)我錯了，雖然執(zhí)行結果是對的放闺，不過瀏覽器和人工解析還是不一樣的祟昭，和我們最開始預想的一樣，函數(shù)優(yōu)先怖侦。
既然標題說到了 變量 和 函數(shù)篡悟，我們就一塊來說說
//簡單的栗子
function a(){ console.log(a) }
console.log(a)
var a = 1
a()
首先上邊已經說到我們預想和認為的是錯的。
正確解析順序是這樣的
function a(){ console.log(a) }
var a;
console.log(a)
a = 1
a()
但是匾寝，這個但是很重要瀏覽器執(zhí)行結果是：
image.png
why搬葬？這就要講講我所了解到的原理。
同名變量和函數(shù)旗吁，函數(shù)會提升到最前邊踩萎，變量其次，為什么不那為什么結果不是我們人工執(zhí)行的undefined呢很钓？原因是 變量會被忽略香府，是的是忽略。码倦。企孩。
function a(){ console.log(a) }
var a;//忽略
console.log(a) //打印函數(shù)本身
a = 1
a()// a is not a function
完美！
還有呢袁稽？是的還有同名變量是怎樣的順序勿璃，同名函數(shù)是怎樣的順序。
同名變量
console.log(a)
var a = 1
console.log(a)
var a = 2
console.log(a)
//解析完順序是這樣的
var a；
var a; //忽略
console.log(a) // undfined
a = 1
console.log(a) //1
a = 2
console.log(a)//2
*同名變量补疑，聲明會被提升歧沪，后邊會忽略。
同名函數(shù)
function a(){console.log(1)}
console.log(a)
function a(){console.log(2)}
console.log(a)
a()
//解析完
function a(){console.log(1)}
function a(){console.log(2)}
console.log(a)
console.log(a)
a()
執(zhí)行結果
image.png
我想你已經猜到了莲组，同名函數(shù)會被覆蓋诊胞。
終于完了！
您的點贊是我繼續(xù)下去的動力锹杈，謝謝撵孤！
