Javascript是一種基于對(duì)象的動(dòng)態(tài)、弱類(lèi)型腳本語(yǔ)言（以下簡(jiǎn)稱(chēng)JS），是一種解釋型語(yǔ)言，和其他的編程語(yǔ)言不同，如java/C++等編譯型語(yǔ)言，這些語(yǔ)言在代碼執(zhí)行前會(huì)進(jìn)行通篇編譯，先編譯成字節(jié)碼（機(jī)器碼）。然后在執(zhí)行。而JS不是這樣做的，JS是不需要編譯成中間碼，而是可以直接在瀏覽器中運(yùn)行，JS運(yùn)行過(guò)程可分為兩個(gè)階段，編譯和執(zhí)行。(可參考你不知道的JS這本書(shū)），當(dāng)JS控制器轉(zhuǎn)到一段可執(zhí)行的代碼時(shí)（這段可執(zhí)行代碼就是編譯階段生成的），會(huì)創(chuàng)建與之對(duì)應(yīng)的執(zhí)行上下文(Excution Context簡(jiǎn)稱(chēng)EC)。執(zhí)行上下文可以理解為執(zhí)行環(huán)境（執(zhí)行上下文只能由JS解釋器創(chuàng)建，也只能由JS解釋器使用，用戶是不可以操作該‘對(duì)象'的）。
JS中的執(zhí)行環(huán)境分為三類(lèi):
全局環(huán)境：當(dāng)JS引擎進(jìn)入一個(gè)代碼塊時(shí)，如遇到<script>xxx</script>標(biāo)簽，就是進(jìn)入一個(gè)全局執(zhí)行環(huán)境
函數(shù)環(huán)境：當(dāng)一個(gè)函數(shù)被調(diào)用時(shí)，在函數(shù)內(nèi)部就形成了一個(gè)函數(shù)執(zhí)行環(huán)境
eval()：把字符串單做JS代碼執(zhí)行，不推薦使用
在一段JS代碼中可能會(huì)產(chǎn)生多個(gè)執(zhí)行上下文，在JS中用棧這種數(shù)據(jù)結(jié)構(gòu)來(lái)管理執(zhí)行上下文，棧的特點(diǎn)是“先進(jìn)后出，后進(jìn)先出”,這種棧稱(chēng)之為函數(shù)調(diào)用棧。
執(zhí)行上下文的特點(diǎn)
棧底永遠(yuǎn)是全局執(zhí)行上下文，有且僅有一個(gè)
全局執(zhí)行上下文只有在瀏覽器關(guān)閉時(shí)，才會(huì)彈出棧
其他的執(zhí)行上下文的數(shù)量沒(méi)有限制
棧頂永遠(yuǎn)是當(dāng)前活動(dòng)執(zhí)行上下文，其余的都處于等待狀態(tài)中，一旦執(zhí)行完畢，立即彈出棧，然后控制權(quán)交回下一個(gè)執(zhí)行上下文
函數(shù)只有在每次被調(diào)用時(shí)，才會(huì)為其創(chuàng)建執(zhí)行上下文，函數(shù)被聲明時(shí)是沒(méi)有的。
執(zhí)行上下文可以形象的理解為一個(gè)普通的JS對(duì)象，一個(gè)執(zhí)行上下文的生命周期大概包含兩個(gè)階段：
創(chuàng)建階段
此階段主要完成三件事件，1、創(chuàng)建變量對(duì)象 2、建立作用域鏈 3、確定this指向
執(zhí)行階段
此階段主要完成變量賦值、函數(shù)調(diào)用、其他操作
變量對(duì)象(VO)的創(chuàng)建過(guò)程
1、根據(jù)函數(shù)參數(shù)，創(chuàng)建并初始化arguments對(duì)象，給arguments對(duì)象添加屬性"0","1","2","3"等屬性，其初始值為undefined，并設(shè)置arguments.length值為實(shí)際傳入?yún)?shù)的個(gè)數(shù)。
2、查找function函數(shù)聲明，在變量對(duì)象上添加屬性，屬性名就是函數(shù)名，屬性值就是函數(shù)的引用值，如果已經(jīng)存在同名的，則直接覆蓋
3、查找var變量聲明(查找變量時(shí)，會(huì)把函數(shù)的參數(shù)等價(jià)于var聲明，所以在VO中也會(huì)添加和參數(shù)名一樣的屬性，初始值也是undefined)，在變量對(duì)象添加屬性，屬性名就是變量名，屬性值是undefined，如果已經(jīng)存在同名的，則不處理
如果存在同名標(biāo)識(shí)符（函數(shù)、變量），則函數(shù)可以覆蓋變量，函數(shù)的優(yōu)先級(jí)高于變量
變量對(duì)象（OV）和激活對(duì)象（AO）是同一個(gè)東西，在不同時(shí)期的兩種叫法。在創(chuàng)建時(shí)期叫變量對(duì)象，在執(zhí)行時(shí)期叫激活對(duì)象
以如下代碼為例
var g_name="tom";
var g_age=20;
function g_fn(num){
var l_name="kity";
var l_age=18;
function l_fn(){
console.log(g_name + '===' + l_name + '===' + num);
}
}
g_fn(10);編譯階段
當(dāng)JS控制器轉(zhuǎn)到這一段代碼時(shí)，會(huì)創(chuàng)建一個(gè)執(zhí)行上下文，G_EC
執(zhí)行上下文的結(jié)構(gòu)大概如下：
G_EC = {
VO : {},
Scope_chain : [],
this : {}
}
VO = {
g_name : undefined,
g_age : undefined,
g_fn : <函數(shù)在內(nèi)存中引用值>
}
Scope_chain = [ G_EC.VO ] // 數(shù)組中第一個(gè)元素是當(dāng)前執(zhí)行上下文的VO，第二個(gè)是父執(zhí)行上下文的VO,最后一個(gè)是全局執(zhí)行上下文的VO,在執(zhí)行階段，會(huì)沿著這個(gè)作用域鏈一個(gè)一個(gè)的查找標(biāo)識(shí)符，如果查到則返回，否知一直查找到全局執(zhí)行上下文的VO
this = undefined // 此時(shí)this的值是undefined執(zhí)行上下文一旦創(chuàng)建完畢，就立馬被壓入函數(shù)調(diào)用棧中，此時(shí)解釋器會(huì)悄悄的做一件事情，就是給當(dāng)前VO中的函數(shù)添加一個(gè)內(nèi)部屬性[[scope]],該屬性指向上面的作用域鏈。
g_fn.scope = [ global_EC.VO ] // 該scope屬性只能被JS解釋器所使用，用戶無(wú)法使用
執(zhí)行階段
一行一行執(zhí)行代碼，當(dāng)遇到一個(gè)表達(dá)式時(shí)，就會(huì)去當(dāng)前作用域鏈的中查找VO對(duì)象，如果找到則返回，如果找不到,則繼續(xù)查找下一個(gè)VO對(duì)象，直至全局VO對(duì)象終止。
此階段可以有變量賦值，函數(shù)調(diào)用等操作，當(dāng)解釋器遇到g_fn()時(shí)，就知道這是一個(gè)函數(shù)調(diào)用，然后立即為其創(chuàng)建一個(gè)函數(shù)執(zhí)行上下文，fn_EC，該上下文fn_EC同樣有兩個(gè)階段
分別是創(chuàng)建階段和執(zhí)行階段。
在創(chuàng)建階段，對(duì)于函數(shù)執(zhí)行上下文，在創(chuàng)建變量對(duì)象時(shí)，會(huì)多創(chuàng)建一個(gè)arguments對(duì)象，然后為arguments對(duì)象添加屬性:"0"，"1", "2"其初始值為undefined,
查找function函數(shù)聲明
查找var變量聲明
相關(guān)推薦：
Javascript運(yùn)行機(jī)制示例代碼分析
javascript運(yùn)行機(jī)制之this詳細(xì)介紹_基礎(chǔ)知識(shí)
Javascript運(yùn)行機(jī)制之事件循環(huán)(Event Loop)詳解_javascript技巧
以上就是詳解Javascript的運(yùn)行原理的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！