本篇內(nèi)容介紹了“JavaScript預(yù)編譯過(guò)程是什么”的有關(guān)知識(shí)，在實(shí)際案例的操作過(guò)程中，不少人都會(huì)遇到這樣的困境，接下來(lái)就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧！希望大家仔細(xì)閱讀，能夠?qū)W有所成！
10年積累的成都做網(wǎng)站、網(wǎng)站建設(shè)、外貿(mào)營(yíng)銷(xiāo)網(wǎng)站建設(shè)經(jīng)驗(yàn)，可以快速應(yīng)對(duì)客戶對(duì)網(wǎng)站的新想法和需求。提供各種問(wèn)題對(duì)應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你，你也不認(rèn)識(shí)我。但先制作網(wǎng)站后付款的網(wǎng)站建設(shè)流程，更有泊頭免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
詞法語(yǔ)法分析：詞法語(yǔ)法分析就是檢查JavaScript代碼是否有一些低級(jí)的語(yǔ)法錯(cuò)誤
預(yù)編譯：本文主講
執(zhí)行代碼：執(zhí)行代碼就是js引擎解析代碼，解析一行執(zhí)行一行
這章主要講預(yù)編譯過(guò)程
預(yù)編譯也分為2個(gè)時(shí)間點(diǎn)：
第一個(gè)是在JavaScript代碼執(zhí)行之前
第二個(gè)是在函數(shù)執(zhí)行之前。
但是JavaScript代碼之前，之前的預(yù)編譯只發(fā)生一次，函數(shù)執(zhí)行之前的預(yù)編譯是多次的。
JavaScript代碼執(zhí)行之前，首先會(huì)創(chuàng)建一個(gè)全局對(duì)象，可以理解為window對(duì)象，也可以理解為GO（Global Object）對(duì)象，我們是看不到的(無(wú)法打印)
然后將所有聲明的全局變量、未使用var和let聲明的變量放到GO對(duì)象中，并且賦值為undefined(聯(lián)想到“變量提升”)
分析**函數(shù)聲明：**然后再將所有的函數(shù)聲明也放到GO對(duì)象中，并且賦值為函數(shù)自身的函數(shù)體(函數(shù)名為屬性名,值為函數(shù)體，如果函數(shù)名和變量名相同，則無(wú)情覆蓋)
結(jié)合上面說(shuō)的步驟：
首先，中的代碼執(zhí)行之前會(huì)創(chuàng)建一個(gè)GO對(duì)象(window對(duì)象)
重慶分公司
重慶分公司
GO = {
//自帶的屬性都不寫(xiě)
}將所有聲明的全局變量、未使用var和let聲明的變量放到GO對(duì)象中，并且賦值為undefined
GO = {
a : undefined,
b : undefined,
a2 : undefined
}分析函數(shù)聲明，函數(shù)名為屬性名,值為函數(shù)體，如果函數(shù)名和變量名相同，則無(wú)情覆蓋
GO = {
a : undefined,
b : undefined,
a2 : undefined,
function fun (a) {
var a = b = 2;
var c = 123;
}
}此時(shí)完成了js代碼執(zhí)行之前的預(yù)編譯過(guò)程，開(kāi)始執(zhí)行js代碼，首先是給a進(jìn)行賦值為1，在GO對(duì)象里邊也會(huì)進(jìn)行對(duì)應(yīng)的改變：
GO = {
a : 1,
b : undefined,
a2 : undefined,
function fun (a) {
var a = b = 2;
var c = 123;
}
}然后打印a，此時(shí)會(huì)在GO對(duì)象上去找變量a，然后此時(shí)的a的值為1，所以console.log(a) 是等于1的。接著打印b，也會(huì)去GO對(duì)象上找，找到了b的值為undefined，所以console.log(b)是等于undefined。
接著執(zhí)行到賦值語(yǔ)句：b = 10; 此時(shí)GO對(duì)象里b的值變成了10
GO = {
a : 1,
b : 10,
a2 : undefined,
function fun (a) {
var a = b = 2;
var c = 123;
}
}接著下一行代碼是一個(gè)**fun函數(shù)，此時(shí)不會(huì)去執(zhí)行該函數(shù)**，因?yàn)樵谇懊娴念A(yù)編譯過(guò)程中實(shí)際上是被放到了代碼的最前端，就是傳說(shuō)中的聲明提前，所以忽略掉了。接著給a2進(jìn)行賦值操作：a2 = 20，GO對(duì)象也發(fā)生變化：
GO = {
a : 1,
b : 10,
a2 : 20,
function fun (a) {
var a = b = 2;
var c = 123;
}
}接著是執(zhí)行fun函數(shù)，如上面說(shuō)到的另外一個(gè)時(shí)間點(diǎn)發(fā)生的預(yù)編譯，就是執(zhí)行函數(shù)之前，現(xiàn)在就來(lái)說(shuō)一下函數(shù)執(zhí)行前的預(yù)編譯是怎么樣的。
函數(shù)調(diào)用,也是會(huì)生成自己的作用域(**AO：**Activetion Object,執(zhí)行期上下文)AO活動(dòng)對(duì)象。函數(shù)調(diào)用時(shí)候,執(zhí)行前的一瞬間產(chǎn)生的,如果有多個(gè)函數(shù)的調(diào)用,會(huì)產(chǎn)生多個(gè)AO
如果遇到AO對(duì)象上屬性同名，則無(wú)情覆蓋
生成AO對(duì)象：函數(shù)執(zhí)行前的一瞬間，生成AO活動(dòng)對(duì)象
分析生成AO屬性：查找形參和變量聲明放到AO對(duì)象，賦值為undefined
分析函數(shù)聲明：查找函數(shù)聲明放到AO對(duì)象并賦值為函數(shù)體。函數(shù)名為屬性名,值為函數(shù)體；
逐行執(zhí)行。
拿的是上文中的代碼示例。
第一步創(chuàng)建AO對(duì)象
AO{
}查找形參和變量聲明放到AO對(duì)象并賦值為undefined；
注意：
fun函數(shù)里邊的b是未經(jīng)var聲明的，所以是全局變量，不會(huì)被放在fun的AO上。
AO{
a: undefined,//形參a與局部變量a同名
c: undefined
}將實(shí)參賦值到形參上
AO{
a: 1,
c: undefined,
}查找函數(shù)聲明放到AO對(duì)象并賦值為函數(shù)體，fun函數(shù)沒(méi)有函數(shù)聲明，所以忽略這一步。
函數(shù)執(zhí)行之前的預(yù)編譯完成，開(kāi)始執(zhí)行語(yǔ)句
執(zhí)行代碼
首先執(zhí)行打印變量b，而此時(shí)fun的AO里邊并沒(méi)有變量b，所以會(huì)去GO對(duì)象里邊找，此時(shí)的GO對(duì)象b的值為10，所以第一行代碼打印出10；
第二行代碼首先要看的是b = 2，然后GO對(duì)象里邊b的值就被改為2了。
GO = {
a : 1,
b : 10,
a2 : 20,
function fun (a) {
var a = b = 2;
var c = 123;
}
}然后b再賦值給a，變量a是屬于局部變量a，所以fun的AO對(duì)象里邊a的值被改為2。
AO{
a: 2,
c: undefined,
}接著下一個(gè)賦值語(yǔ)句是c = 123，所以AO對(duì)象中c的值被改為了123
AO{
a: 2,
c: 123,
}此時(shí)再執(zhí)行console.log(a)的值就是AO對(duì)象里邊a的值 2；執(zhí)行console.log(b)的值就是GO對(duì)象b的值 2，至此函數(shù)fun執(zhí)行完畢，緊跟著fun的AO也會(huì)被銷(xiāo)毀。
綜上所述，依次打印出來(lái)的值為：1，undefined，10，2，2。
“JavaScript預(yù)編譯過(guò)程是什么”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí)可以關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實(shí)用文章！
