JS學(xué)習(xí)系列 05 - 執(zhí)行上下文

在我們前面理解了作用域之后汇荐,“作用域鏈”這個(gè)概念就產(chǎn)生了携冤。那么作用域鏈?zhǔn)鞘裁匆馑迹质窃趺葱纬傻闹让男└拍钣嘘P(guān)系砚亭,這就是我接下來幾章想和大家探討的內(nèi)容:執(zhí)行上下文、變量對(duì)象和作用域鏈殴玛。根據(jù)順序我們也可以看出來捅膘,想要理解作用域鏈,執(zhí)行上下文是我們碰到的第一個(gè)坎滚粟。

這一章我們就來討論一下到底什么是執(zhí)行上下文篓跛。

1. 定義

當(dāng) JS 引擎開始執(zhí)行預(yù)編譯生成的代碼時(shí),就會(huì)進(jìn)入到一個(gè)執(zhí)行上下文(Executable Code - 簡稱 EC)坦刀。

在 ECMA 標(biāo)準(zhǔn)規(guī)范里并沒有從技術(shù)角度去定義 EC 的具體類型和結(jié)構(gòu)愧沟,這個(gè)是在實(shí)現(xiàn) ECMAScript 引擎時(shí)需要考慮的問題。

但是在邏輯上鲤遥,我們可以將活動(dòng)的執(zhí)行上下文看成一個(gè)棧結(jié)構(gòu)沐寺。棧底部永遠(yuǎn)是全局上下文(global context),而頂部就是當(dāng)前活動(dòng)的執(zhí)行上下文盖奈。執(zhí)行到當(dāng)前代碼時(shí)混坞,上下文入棧,執(zhí)行完畢后钢坦,上下文出棧究孕。

2. 可執(zhí)行代碼有幾種

前面說到當(dāng)引擎執(zhí)行到可執(zhí)行代碼的時(shí)候,就會(huì)將當(dāng)前上下文壓入上下文棧中爹凹。那么可執(zhí)行的代碼又分為幾種厨诸?

在這里,我們先假設(shè)定義執(zhí)行上下文棧是一個(gè)數(shù)組:

EC = [];

第一種可執(zhí)行代碼 -- 全局代碼:
全局類型代碼是在加載外部的 js 文件或者本地 <script></script> 標(biāo)簽中的代碼禾酱。
注意微酬,在全局代碼中,并不包含定義在全局環(huán)境 function 內(nèi)的代碼颤陶。

程序啟動(dòng)后進(jìn)入初始化全局環(huán)境:

EC = [
    globalContext
];

第二種可執(zhí)行代碼 -- 函數(shù)代碼:
當(dāng)定義的函數(shù)被執(zhí)行時(shí)颗管,就進(jìn)入了函數(shù)代碼,當(dāng)前函數(shù)上下文被壓入 EC 棧中滓走。
注意垦江,在函數(shù)代碼中,也不包含定義在該函數(shù)內(nèi)部環(huán)境 function 內(nèi)的代碼搅方。

例如:

var a = 10;

function foo () {
  var b = 20;
  
  foo();
}

foo();

這個(gè)例子中的 EC 是什么樣子的呢比吭?

// 初始化
EC = [
  globalContext
];

// 第一次調(diào)用 foo 函數(shù)
EC = [
  <foo> functionContext,
  globalContext
];

// 在 foo 內(nèi)遞歸調(diào)用自己
EC = [
  <foo> functionContext - recursively,
  <foo> functionContext,
  globalContext
];

// 繼續(xù)遞歸調(diào)用自己
EC = [
  ......
  <foo> functionContext - recursively2,
  <foo> functionContext - recursively,
  <foo> functionContext,
  globalContext
];

// 遞歸會(huì)不斷調(diào)用下去绽族,因?yàn)闆]有結(jié)束條件,所以這是一個(gè)死循環(huán)
// 所以梗逮,EC 只會(huì)不斷增加新的上下文项秉,但是卻不會(huì)退出

只有每次 return 的時(shí)候,才會(huì)退出當(dāng)前執(zhí)行上下文慷彤,相應(yīng)上下文會(huì)從棧中彈出娄蔼,棧指針會(huì)自動(dòng)移動(dòng)位置。

注意底哗,當(dāng)函數(shù)沒有明確指明 return 什么的時(shí)候岁诉,默認(rèn) return undefined

如果有拋出的異常沒有被截獲的話跋选,也有可能從一個(gè)或多個(gè)執(zhí)行上下文中退出涕癣。當(dāng)所有代碼執(zhí)行完以后,EC 中只會(huì)包含全局上下文(global context)前标,當(dāng)程序退出以后坠韩,全局上下文也會(huì)退出。

第三種可執(zhí)行代碼 -- eval 代碼:
eval 函數(shù)在調(diào)用的時(shí)候會(huì)產(chǎn)生上下文炼列。
例如:

eval('var a = 10');

(function foo () {
  eval('var b = 20');
}());

alert(a);    // 10
alert(b);    // ReferenceError只搁,b is not defined 

這個(gè)例子中 EC 的變化如下:

// 初始化
EC = [
  globalContext
];

// eval('var a = 10');
EC = [
  evalContext,
  globalContext
];

// eval 執(zhí)行完畢
EC = [
  globalContext
];

// 立即執(zhí)行函數(shù) foo
EC = [
  <foo> functionContext,
  globalContext
];

// eval('var b = 20');
EC = [
  evalContext,
  <foo> functionContext,
  globalContext
];

// eval 執(zhí)行完畢
EC = [
  <foo> functionContext,
  globalContext
];

// foo 執(zhí)行完畢
EC = [
  globalContext
];

這就是一個(gè)典型的邏輯調(diào)用上下文棧

在 setTimeout 和 setInterval 函數(shù)中的第一個(gè)參數(shù)也可以傳入代碼字符串俭尖,但是這個(gè)一般不會(huì)這么去用氢惋,所以這里也就不討論了。

3. 結(jié)論

執(zhí)行上下文環(huán)境是我們了解變量對(duì)象作用域鏈的基礎(chǔ)稽犁,大家一定要好好理解(其實(shí)也并不難)焰望,下一節(jié)我們來討論變量對(duì)象,相信會(huì)讓大家有一定的收獲已亥。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末熊赖,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子陷猫,更是在濱河造成了極大的恐慌秫舌,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,941評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件绣檬,死亡現(xiàn)場離奇詭異,居然都是意外死亡嫂粟,警方通過查閱死者的電腦和手機(jī)娇未,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,397評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來星虹,“玉大人零抬,你說我怎么就攤上這事镊讼。” “怎么了平夜?”我有些...
    開封第一講書人閱讀 165,345評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵蝶棋,是天一觀的道長。 經(jīng)常有香客問我忽妒,道長玩裙,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,851評(píng)論 1 295
  • 正文 為了忘掉前任段直,我火速辦了婚禮吃溅,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘鸯檬。我一直安慰自己决侈,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,868評(píng)論 6 392
  • 文/花漫 我一把揭開白布喧务。 她就那樣靜靜地躺著赖歌,像睡著了一般。 火紅的嫁衣襯著肌膚如雪功茴。 梳的紋絲不亂的頭發(fā)上庐冯,一...
    開封第一講書人閱讀 51,688評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音痊土,去河邊找鬼肄扎。 笑死,一個(gè)胖子當(dāng)著我的面吹牛赁酝,可吹牛的內(nèi)容都是我干的犯祠。 我是一名探鬼主播,決...
    沈念sama閱讀 40,414評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼酌呆,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼衡载!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起隙袁,我...
    開封第一講書人閱讀 39,319評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤痰娱,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后菩收,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體梨睁,經(jīng)...
    沈念sama閱讀 45,775評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評(píng)論 3 336
  • 正文 我和宋清朗相戀三年娜饵,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了坡贺。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,096評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖遍坟,靈堂內(nèi)的尸體忽然破棺而出拳亿,到底是詐尸還是另有隱情,我是刑警寧澤愿伴,帶...
    沈念sama閱讀 35,789評(píng)論 5 346
  • 正文 年R本政府宣布肺魁,位于F島的核電站,受9級(jí)特大地震影響隔节,放射性物質(zhì)發(fā)生泄漏鹅经。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,437評(píng)論 3 331
  • 文/蒙蒙 一官帘、第九天 我趴在偏房一處隱蔽的房頂上張望瞬雹。 院中可真熱鬧,春花似錦刽虹、人聲如沸酗捌。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,993評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽胖缤。三九已至,卻和暖如春阀圾,著一層夾襖步出監(jiān)牢的瞬間哪廓,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,107評(píng)論 1 271
  • 我被黑心中介騙來泰國打工初烘, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留涡真,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,308評(píng)論 3 372
  • 正文 我出身青樓肾筐,卻偏偏與公主長得像哆料,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子吗铐,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,037評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容