DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 深入理解JavaScript系列(11) 執行上下文(Execution Contexts)
深入理解JavaScript系列(11) 執行上下文(Execution Contexts)
編輯:關於JavaScript     
簡介
從本章開始,我將陸續(翻譯、轉載、整理)http://dmitrysoshnikov.com/網站關於ECMAScript標標准理解的好文。

本章我們要講解的是ECMAScript標准裡的執行上下文和相關可執行代碼的各種類型。

原始作者:Dmitry A. Soshnikov
原始發布: 2009-06-26
俄文原文:http://dmitrysoshnikov.com/ecmascript/ru-chapter-1-execution-contexts/

英文翻譯:Dmitry A. Soshnikov.
發布時間:2010-03-11
英文翻譯:http://dmitrysoshnikov.com/ecmascript/chapter-1-execution-contexts/

本文參考了博客園justinw的中文翻譯,做了一些錯誤修正,感謝譯者。
復制代碼
定義
每次當控制器轉到ECMAScript可執行代碼的時候,即會進入到一個執行上下文。執行上下文(簡稱-EC)是ECMA-262標准裡的一個抽象概念,用於同可執行代碼(executable code)概念進行區分。

標准規范沒有從技術實現的角度定義EC的准確類型和結構,這應該是具體實現ECMAScript引擎時要考慮的問題。

活動的執行上下文組在邏輯上組成一個堆棧。堆棧底部永遠都是全局上下文(global context),而頂部就是當前(活動的)執行上下文。堆棧在EC類型進入和退出上下文的時候被修改(推入或彈出)。

可執行代碼類型
可執行代碼的類型這個概念與執行上下文的抽象概念是有關系的。在某些時刻,可執行代碼與執行上下文完全有可能是等價的。

例如,我們可以定義執行上下文堆棧是一個數組:

ECStack = [];
每次進入function (即使function被遞歸調用或作為構造函數) 的時候或者內置的eval函數工作的時候,這個堆棧都會被壓入。

全局代碼
這種類型的代碼是在"程序"級處理的:例如加載外部的js文件或者本地<script></script>標簽內的代碼。全局代碼不包括任何function體內的代碼。

在初始化(程序啟動)階段,ECStack是這樣的:
復制代碼 代碼如下:
ECStack = [
globalContext
];

函數代碼
當進入funtion函數代碼(所有類型的funtions)的時候,ECStack被壓入新元素。需要注意的是,具體的函數代碼不包括內部函數(inner functions)代碼。如下所示,我們使函數自己調自己的方式遞歸一次:
復制代碼 代碼如下:
(function foo(bar) {
if (bar) {
return;
}
foo(true);
})();

那麼,ECStack以如下方式被改變:
復制代碼 代碼如下:
// 第一次foo的激活調用
ECStack = [
<foo> functionContext
globalContext
];

// foo的遞歸激活調用
ECStack = [
<foo> functionContext – recursively
<foo> functionContext
globalContext
];

每次return的時候,都會退出當前執行上下文的,相應地ECStack就會彈出,棧指針會自動移動位置,這是一個典型的堆棧實現方式。一個拋出的異常如果沒被截獲的話也有可能從一個或多個執行上下文退出。相關代碼執行完以後,ECStack只會包含全局上下文(global context),一直到整個應用程序結束。

Eval 代碼
eval 代碼有點兒意思。它有一個概念: 調用上下文(calling context),例如,eval函數調用的時候產生的上下文。eval(變量或函數聲明)活動會影響調用上下文(calling context)。
復制代碼 代碼如下:
eval('var x = 10');

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

alert(x); // 10
alert(y); // "y" 提示沒有聲明

ECStack的變化過程:
復制代碼 代碼如下:
ECStack = [
globalContext
];

// eval('var x = 10');
ECStack.push(
evalContext,
callingContext: globalContext
);

// eval exited context
ECStack.pop();

// foo funciton call
ECStack.push(<foo> functionContext);

// eval('var y = 20');
ECStack.push(
evalContext,
callingContext: <foo> functionContext
);

// return from eval
ECStack.pop();

// return from foo
ECStack.pop();

也就是一個非常普通的邏輯調用堆棧。

在版本號1.7以上的SpiderMonkey(內置於Firefox,Thunderbird)的實現中,可以把調用上下文作為第二個參數傳遞給eval。那麼,如果這個上下文存在,就有可能影響“私有”(有人喜歡這樣叫它)變量。
復制代碼 代碼如下:
function foo() {
var x = 1;
return function () { alert(x); };
};

var bar = foo();

bar(); // 1

eval('x = 2', bar); // 傳入上下文,影響了內部的var x 變量

bar(); // 2

結論
這篇文章是後面分析其他跟執行上下文相關的主題(例如變量對象,作用域鏈,等等)的最起碼的理論基礎,這些主題將在後續章節中講到。

其他參考
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved