深入理解javascript原型和閉包(13)-【作用域】和【上下文環境】


上文簡單介紹了作用域,本文把作用域和上下文環境結合起來說一下,會理解的更深一些。

如上圖,我們在上文中已經介紹了,除了全局作用域之外,每個函數都會創建自己的作用域,作用域在函數定義時就已經確定了。而不是在函數調用時確定

下面我們將按照程序執行的順序,一步一步把各個上下文環境加上。另外,對上下文環境不了解的朋友,可以去看看之前的兩篇文章:

http://www.cnblogs.com/wangfupeng1988/p/3986420.html

http://www.cnblogs.com/wangfupeng1988/p/3987563.html

 

第一步,在加載程序時,已經確定了全局上下文環境,並隨着程序的執行而對變量就行賦值。

 

第二步,程序執行到第27行,調用fn(10),此時生成此次調用fn函數時的上下文環境,壓棧,並將此上下文環境設置為活動狀態。

 

第三步,執行到第23行時,調用bar(100),生成此次調用的上下文環境,壓棧,並設置為活動狀態。

 

第四步,執行完第23行,bar(100)調用完成。則bar(100)上下文環境被銷毀。接着執行第24行,調用bar(200),則又生成bar(200)的上下文環境,壓棧,設置為活動狀態。

 

第五步,執行完第24行,則bar(200)調用結束,其上下文環境被銷毀。此時會回到fn(10)上下文環境,變為活動狀態。

 

第六步,執行完第27行代碼,fn(10)執行完成之后,fn(10)上下文環境被銷毀,全局上下文環境又回到活動狀態。

 

結束了。像老太太的裹腳布——又臭又長!

 

最后我們可以把以上這幾個圖片連接起來看看。

連接起來看,還是挺有意思的。作用域只是一個“地盤”,一個抽象的概念,其中沒有變量。要通過作用域對應的執行上下文環境來獲取變量的值。同一個作用域下,不同的調用會產生不同的執行上下文環境,繼而產生不同的變量的值。所以,作用域中變量的值是在執行過程中產生的確定的,而作用域卻是在函數創建時就確定了

所以,如果要查找一個作用域下某個變量的值,就需要找到這個作用域對應的執行上下文環境,再在其中尋找變量的值

 

雖然本文很長,但是文字較少,圖片居多,圖片都有形象的展示,大家花十幾分鍾也能慢慢看完。但是,這節內容真的很重要。

以上代碼中,咱們還沒有設計到跨作用域取值的情況,即——自由變量。詳細內容且聽下回分解。

---------------------------------------------------------------------------

本文已更新到《深入理解javascript原型和閉包系列》的目錄,更多內容可參見《深入理解javascript原型和閉包系列》。

另外,歡迎關注我的微博

學習作者教程:《前端JS高級面試》《前端JS基礎面試題》《React.js模擬大眾點評webapp》《zepto設計與源碼分析》《json2.js源碼解讀


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM