JavaScript中怎么實(shí)現預解析處理

這期內容當中小編將會(huì )給大家帶來(lái)有關(guān)JavaScript中怎么實(shí)現預解析處理，文章內容豐富且以專(zhuān)業(yè)的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

1.預解析發(fā)生的時(shí)機

（1）、遇到<script>標簽時(shí)

瀏覽器加載到<script>標簽時(shí)，將使用javascript引擎對<script></script>標簽對之間的代碼塊進(jìn)行預解析：找到函數定義和函數體外的所有var聲明的變量，并給它們分配內存和設置初始值。

對同名的var變量和函數變量，只會(huì )分配一次棧內存。但在堆內存中會(huì )給函數變量的初始值分配內存。對變量賦初始值時(shí)，函數變量初始值優(yōu)先級高于var變量初始值，而同級別的函數變量，后定義的函數優(yōu)先于先定義的函數。

所以var變量名和函數變量名相同時(shí)，如果內存中的變量的值一開(kāi)始為undefined，但最終內存中該變量的初始值會(huì )替換為函數變量的值;否則變量的初始值保持不變。而同名的函數變量，后面定義的函數會(huì )替換前面定義的函數。

(2)、遇到函數時(shí)

每一對<script></script>標簽中的代碼預解析完后會(huì )立即逐行解讀代碼。在解讀代碼的過(guò)程中，如果遇到函數調用，此時(shí)會(huì )在函數作用域中首先進(jìn)行預解析處理，預解析處理完才會(huì )執行函數代碼。在函數作用域的預解析規則是：找到命名函數、所有var變量和函數定義，并給它們在函數作用域中分配內存和設置初始值。對同名的var變量、命名參數和函數變量，只會(huì )分配一次棧內存，但在堆內存中會(huì )給函數變量的初始值分配內存。對變量賦初始值時(shí)，函數變量的值優(yōu)先級最高，其次是命名參數值。所以命名參數名和var變量名相同，內存中變量的值是參數值;如果命名參數名和函數變量名相同或var變量名和函數變量名相同，內存中變量的值為函數變量值。

2.頁(yè)面中包含多個(gè)<script></script>標簽時(shí)的預解析

當頁(yè)面中包含多個(gè)<script></script>標簽時(shí)，javascript引擎會(huì )按頁(yè)面中<script></script>標簽出現的順序，從上往下對每一個(gè)<script></script>標簽對之間的腳本代碼塊分別進(jìn)行預解析和逐行解讀處理。每一個(gè)<script></script>標簽對之間代碼的預解析是全局范圍的，在函數調用時(shí)發(fā)上發(fā)生的函數代碼預解析則是針對函數范圍的。

需要注意的是，變量在預解析處理得到的初始值在逐行解讀代碼過(guò)程中會(huì )被賦值表達式(帶有=，+=，-=，*=，/=，++，--等運算符號的語(yǔ)句)修改。

示例

我們通過(guò)幾個(gè)示例來(lái)詳細看一下。

預解析變量的優(yōu)先級示例：

<script> alert("(1)該行結果是：" + a)  // 1 var a = 3; // 2 alert("(2)該行結果是" + a) // 3 function a (){ // 4  alert(2); } var a = 6; // 5 function a(){ // 6  alert(4); } alert("(3)該行結果是"+ a); // 7  </script>

彈出框結果分別為：

1處彈出的內容：

(1)該行結果是： function a(){    alert(4); }

3處彈出的內容：

(2)該行結果是: 3

7處彈出的內容：

(3)該行結果是: 6

上述運行結果正是預解析和逐行解讀分階段處理的結果。Javascript引擎遇到<script></script>標簽時(shí)，開(kāi)始按代碼出現的順序進(jìn)行預解析處理：首先預解析注釋2處的var變量a，給它分配內存，并給他賦初始值為"undefined";然后預解析注釋4處的函數變量a，發(fā)現該變量和已分配內存的var變量同名，所以不再對函數變量a分配棧內存，而只給它分配堆內存存儲函數定義，同時(shí)會(huì )將棧內存中的變量a的值修改為函數變量的初始值function  a(){alert(2);};再接著(zhù)預解析注釋5處的var變量a，該變量與前面預解析得到的函數變量a同名，所以對該變量也不再分配內存，由于函數變量值優(yōu)先于var變量值，所以此時(shí)注釋5處的var變量a初始值undefined不會(huì )修改內存變量的函數定義值;最后預解析注釋6處的函數變量a，發(fā)現它和內存中的變量a同名，也不再給它分配內存，但會(huì )在堆中分配內存存儲6處的函數定義。由于后定義的函數優(yōu)先級高于前面定義的函數，此時(shí)內存的變量a的函數定義值被修改為function  a(){alert(4);}。因此最終內存中的變量a的初始值為function a(){alert(4)};。至此，預解析完成。

接著(zhù)進(jìn)行逐行解讀代碼。在逐行解讀代碼階段，首先解讀到注釋1處代碼，此時(shí)會(huì )去內存中查找變量a，如果找到，讀取變量a的值并輸出到警告對話(huà)框中;如果沒(méi)找到，將報a  is not defined錯誤。上面的預解析的結果是內存中存在變量a，且其值為function  a(){alert(4);}。注釋2處的代碼是一個(gè)賦值表達式：a=3，執行該代碼后，會(huì )將內存中的變量a的值修改為“3”。所以執行到注釋3處代碼時(shí)，從內存中讀取到的值為“3”。注釋4處定義了一個(gè)函數，執行時(shí)會(huì )跳出函數定義不作任何操作。注釋5處代碼是一個(gè)賦值表達式：a=6，執行該行代碼后，會(huì )將內存中的變量a的值修改為“6”。注釋6處又是一個(gè)函數定義，不作解讀。最后執行了注釋7處的代碼，從而讀取到值“6”。