關(guān)于JS預(yù)編譯過程理解械馆。
看一到常見面試題师坎,請問下面輸出的值是多少耍攘?
function fn(a, c) {
console.log(a)
var a = 123
console.log(a)
console.log(c)
function a() { }
if (false) {
var d = 678
}
console.log(d)
console.log(b)
var b = function () { }
console.log(b)
function c() { }
console.log(c)
}
fn(1,2)
正確答案:
function fn(a, c) {
console.log(a) //function a() { }
var a = 123
console.log(a) //123
console.log(c) //function c() { }
function a() { }
if (false) {
var d = 678
}
console.log(d) // undefined
console.log(b) // undefined
var b = function () { }
console.log(b) //function () { }
function c() { }
console.log(c) // function c() { }
}
fn(1,2)
不知道各位有沒有答對呢榕栏?接下來看一下JS在預(yù)編譯階段都做了些啥,你就能理解為啥是這些輸出了蕾各!
1. js會創(chuàng)建ao對象(供js引擎自己去訪問的)
2. 找到形參和變量的申明并且會賦值undefined
3. 實參和形參相統(tǒng)一
4. 找函數(shù)聲明 會覆蓋變量的聲明
接下來我們看一下這個函數(shù)作用域生成的ao對象的過程
//js創(chuàng)建ao對象
ao {
}
//找到形參和變量的申明
ao {
a :undefined
c : undefined
d : undefined
b : undefined
}
//實參和形參相統(tǒng)一
ao {
a :1
c : 2
d : undefined
b : undefined
}
//找函數(shù)聲明 會覆蓋變量的聲明
ao {
a :function a() { }
c : function c() { }
d : undefined
b : undefined
}
到此為止預(yù)編譯階段結(jié)束臼膏,之后js會逐行解釋執(zhí)行。