JavaScript中怎么實現預解析處理

這期內容當中小編將會給大家帶來有關JavaScript中怎么實現預解析處理，文章內容豐富且以專業的角度為大家分析和敘述，閱讀完這篇文章希望大家可以有所收獲。

1.預解析發生的時機

（1）、遇到<script>標簽時

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

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

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

(2)、遇到函數時

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

2.頁面中包含多個<script></script>標簽時的預解析

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

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

示例

我們通過幾個示例來詳細看一下。

預解析變量的優先級示例：

<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>標簽時，開始按代碼出現的順序進行預解析處理：首先預解析注釋2處的var變量a，給它分配內存，并給他賦初始值為"undefined";然后預解析注釋4處的函數變量a，發現該變量和已分配內存的var變量同名，所以不再對函數變量a分配棧內存，而只給它分配堆內存存儲函數定義，同時會將棧內存中的變量a的值修改為函數變量的初始值function  a(){alert(2);};再接著預解析注釋5處的var變量a，該變量與前面預解析得到的函數變量a同名，所以對該變量也不再分配內存，由于函數變量值優先于var變量值，所以此時注釋5處的var變量a初始值undefined不會修改內存變量的函數定義值;最后預解析注釋6處的函數變量a，發現它和內存中的變量a同名，也不再給它分配內存，但會在堆中分配內存存儲6處的函數定義。由于后定義的函數優先級高于前面定義的函數，此時內存的變量a的函數定義值被修改為function  a(){alert(4);}。因此最終內存中的變量a的初始值為function a(){alert(4)};。至此，預解析完成。

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

上述就是小編為大家分享的JavaScript中怎么實現預解析處理了，如果剛好有類似的疑惑，不妨參照上述分析進行理解。如果想知道更多相關知識，歡迎關注億速云行業資訊頻道。