【修真院web小課堂】JS——預(yù)解析
大家好窑滞，我是IT修真院成都分院第11期的學(xué)員毒费，一枚正直純潔善良的WEB程序員 今天給大家分享一下墅茉，JS——預(yù)解析凿跳。
一坑傅、背景介紹
JAVASCRIPT解析機(jī)制是什么僵驰？
JavaScript解析過(guò)程分為兩個(gè)階段，一個(gè)是編譯階段唁毒，另外一個(gè)就是執(zhí)行階段蒜茴。
編譯階段就是我們常說(shuō)的JavaScript預(yù)解析（預(yù)處理）階段，在這個(gè)階段JavaScript解釋器將完成把JavaScript腳本代碼轉(zhuǎn)換到字節(jié)碼浆西。
在編譯階段JavaScript解釋器借助執(zhí)行環(huán)境把字節(jié)碼生成機(jī)械碼粉私，并順序執(zhí)行。
二.具體執(zhí)行的操作
1.var , FUNCTION聲明的變量提升
首先近零，創(chuàng)建一個(gè)當(dāng)前執(zhí)行環(huán)境下的活動(dòng)對(duì)象诺核，然后將用 VAR 聲明的變量設(shè)置為活動(dòng)對(duì)象的屬性（也就是將其添加到活動(dòng)對(duì)象當(dāng)中）并將其賦值為UNDEFINED，然后將 FUNCTION 定義的函數(shù) 也添加到活動(dòng)對(duì)象當(dāng)中秒赤。
2. 函數(shù)聲明與函數(shù)表達(dá)式在預(yù)解析的區(qū)別
首先猪瞬，我們知道解析器會(huì)對(duì)function定義的函數(shù)（也就是函數(shù)聲明）在代碼開(kāi)始執(zhí)行之前對(duì)其實(shí)行函數(shù)聲明提升（function declaration hoisting），所以在函數(shù)聲明之前調(diào)用該函數(shù)是不會(huì)在執(zhí)行期間報(bào)錯(cuò)入篮，但是函數(shù)表達(dá)式不同陈瘦，函數(shù)表達(dá)式用 var 聲明，也就是說(shuō)解析器會(huì)對(duì)其變量提升潮售，并對(duì)其賦值為undefined痊项，然后在執(zhí)行期間，等到執(zhí)行到該var 變量的時(shí)候再將其變量指向一個(gè)function函數(shù)酥诽，所以在函數(shù)表達(dá)式之前執(zhí)行該函數(shù)是會(huì)報(bào)錯(cuò)的鞍泉。
3. function 覆蓋
4. 預(yù)解析把變量或函數(shù)解析到其運(yùn)行時(shí)的環(huán)境中
解析器將變量提升并不是將所有的變量都提升到window對(duì)象下面咖驮，其提升的原則是提升到變量運(yùn)行的環(huán)境中去。
5. var 變量提升以及 function 函數(shù)聲明提升
該點(diǎn)是對(duì)函數(shù)聲明以及函數(shù)表達(dá)式進(jìn)一步的說(shuō)明训枢，其實(shí)前面函數(shù)聲明和函數(shù)表達(dá)式在預(yù)解析的不同表現(xiàn)托修，其主要的原因就是 var 和 function 兩者不同的提升。這個(gè)問(wèn)題從解析階段到運(yùn)行階段來(lái)說(shuō)明恒界。首先睦刃，在解析階段 var 后面的 AA 會(huì)被提升然后 AA 被定義為undefined，BB 也會(huì)被提升十酣，而B(niǎo)B被提升后的內(nèi)容就是整個(gè) function 里面的內(nèi)容涩拙，其實(shí)從瀏覽器的控制臺(tái)我們可以看出一二际长。然后，整個(gè)解析過(guò)程完了就到了運(yùn)行階段兴泥，在運(yùn)行階段期間工育，當(dāng)讀到 AA() 的時(shí)候，其實(shí)就是將 AA 這個(gè)變量指向function(){}這個(gè)函數(shù)然后調(diào)用郁轻，而到了 BB() 的時(shí)候翅娶，就會(huì)從之前聲明的函數(shù)中去查找該早已經(jīng)聲明的函數(shù)，然后直接調(diào)用好唯。
三骑篙、更多討論
問(wèn)題1：下圖分別獲取到此值是怎么得來(lái)的蜕提？
答：第一個(gè)AA（）是因?yàn)楹瘮?shù)聲音才會(huì)提升整個(gè)函數(shù)，所以第一個(gè)AA（）執(zhí)行的是函數(shù)聲明function AA(){};
第二個(gè)AA（）是因?yàn)楹瘮?shù)聲明發(fā)生在預(yù)編譯階段靶端；然后根據(jù)函數(shù)覆蓋谎势，所以執(zhí)行函數(shù)表達(dá)式；
問(wèn)題2杨名、為什么這樣寫(xiě)脏榆，第二個(gè)AA（）執(zhí)行的還是函數(shù)表達(dá)式？
理由同問(wèn)題一，并不只是自上而下掷伙，發(fā)生了函數(shù)覆蓋是己，而是因?yàn)轭A(yù)編譯的作用，函數(shù)聲明提升到了最前面任柜，在執(zhí)行階段卒废，函數(shù)聲明已經(jīng)編譯過(guò)了所以不會(huì)再編譯，然后被后面執(zhí)行的函數(shù)表達(dá)式覆蓋宙地；
問(wèn)題3升熊、為什么第一個(gè)打印出來(lái)是undifined；而不是error绸栅；
如下圖所示這么寫(xiě)就會(huì)報(bào)錯(cuò)风纠；
