JavaScript的預編譯過程分析

graf 發布于2019-08-23 14:00 / 3287人閱讀

摘要：一概念是一個單線程解釋型的編程語言。預編譯大致可分為步創建對象找形參和變量聲明，將形參和變量名作為屬性名，值為將實參值和形參統一在函數體里面找函數聲明，值賦予函數體。

一、JavaScript概念

JavaScript ( JS ) 是一個單線程、解釋型的編程語言。

二、JavaScript語言特點 2.1 單線程

JavaScript語言的一大特點就是單線程，也就是說，同一個時間只能做一件事。

2.2 解釋型語言

自上而下，解釋一行，執行一行；不會通篇編譯為一個文件再執行。

三、 JavaScript執行過程 3.1 語法分析

顧名思義就是檢查一遍js代碼內有沒有出現語法錯誤（比如少些個分號，多寫個括號等）；語法分析期間不會執行代碼

3.2 預編譯

預編譯發生在函數執行的前一刻
全局下：
全局的變量聲明和函數聲明則會存放在全局對象內（Global Object 簡稱GO，它是window的一部分，你可以直接把他理解成window對象）中
函數體內：
預編譯會提前把函數里的變量聲明和函數聲明依據規則存放在該活動對象內（Activation Object，簡稱AO），

預編譯簡單理解就是在內存中開辟一些空間，存放一些變量與函數。

預編譯大致可分為4步：

創建AO(GO)對象

找形參和變量聲明，將形參和變量名作為AO(GO)屬性名，值為undefined

將實參值和形參統一

在函數體里面找函數聲明，值賦予函數體。

所以如果遇到下面這種情況，當函數聲明和變量聲明名稱相同時：

console.log(a); 
var a= 1;
function a(){};

編譯后的代碼其實是：

var a;
function a(){};
console.log(a);
a= 1;

所以最后輸出的是：

function a() {}

預編譯小節

預編譯兩個小規則

函數聲明整體提升—(具體點說，無論函數調用和聲明的位置是前是后，系統總會把函數聲明移到調用前面）

變量聲明提升—(具體點說，無論變量調用和聲明的位置是前是后，系統總會把聲明移到調用前，注意僅僅只是聲明，所以值是undefined），只有在解釋執行階段才會進行變量初始化，匿名函數不參與預編譯。

預編譯前奏

imply global 即任何變量，如果未經聲明就賦值，則此變量就位全局變量所有(全局域就是window) 。

一切聲明的全局變量，全是window的屬性。

3.3 解釋執行

預編譯完畢之后，JavaScript 腳本開始執行，執行順序按照從上到下的順序執行。

總結

JavaScript執行順序

語法分析

預編譯
2.1. 創建AO(GO)對象
2.2. 找形參和變量聲明，將形參和變量名作為AO(GO)屬性名，值為undefined
2.3. 將實參值和形參統一
2.4. 在函數體里面找函數聲明，值賦予函數體。

解釋執行

練習：

function a(a){
    console.log(a);
    a= 2;
    console.log(b);
    var b= 3;
    console.log(a);
}
a(1);
console.log(a);

你可以先試想一下結果，然后復制代碼到控制臺去驗證你的答案是否正確。

云服務器 GPU云服務器編譯過程中出錯語言的編譯過程數據分析分析過程 javascript編譯器

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99921.html

JavaScript的預編譯過程與作用域

摘要：詞法作用域是一種靜態作用域這個例子的結果按靜態作用域來分析執行函數，先從函數內部查找是否有局部變量，如果沒有，就根據書寫的位置，查找上面一層的代碼，也就是等于，所以結果會打印。靜態作用域，決定的是作用域鏈的順序。博客原文地址：https://finget.github.io/2018/03/01/javascriptPrecompile/看不明白的地方歡迎提問，有理解的不對的地方希望...

ziwenxie 2019-08-22 17:07 評論0 收藏0
JavaScript-預編譯

摘要：預編譯發生在函數執行前也就是說函數執行時，預編譯已經結束。五總結理解預編譯需要明白變量函數聲明和變量賦值。預編譯階段，只進行變量函數聲明，不會進行變量的初始化即變量賦值，所有變量的值都是變量賦值是在解釋執行階段才進行的。一、JS的概念 JavaScript ( JS ) 是一種具有函數優先的輕量級解釋型或即時編譯型的編程語言。二、JS語言特點 2.1 單線程（1）JavaScri...

Aldous 2019-08-22 17:01 評論0 收藏0
開發者的進階之路：用語法樹來實現預編譯

摘要：借助語法樹，開發者能夠更好地展現和修改源程序代碼，優化開發環節，提高安全系數，還能進一步實現安卓預編譯。用語法樹來實現預編譯指令開發者還能用語法樹來實現預編譯指令，常見的預編譯指令主要分為條件編譯宏定義文件包含三大類。如何在保證安全性的前提下，提升開發過程的效率，是每個開發者都在不斷探索的問題。借助語法樹，開發者能夠更好地展現和修改源程序代碼，優化開發環節，提高安全系數，還能進一步實...

CoffeX 2019-08-16 14:03 評論0 收藏0
【JDBC系列】從源碼角度理解JDBC和Mysql的預編譯特性

摘要：我們對語句做適當改變，就完成了注入，因為普通的不會對做任何處理，該例中單引號后的生效，拉出了所有數據。查詢資料后，發現還要開啟一個參數，讓端緩存，緩存是級別的。結論是個好東西。背景最近因為工作調整的關系，都在和數據庫打交道，增加了許多和JDBC親密接觸的機會，其實我們用的是Mybatis啦。知其然，知其所以然，是我們工程師童鞋們應該追求的事情，能夠幫助你更好的理解這個技術，面對問題...

longshengwang 2019-08-15 10:54 評論0 收藏0