這篇文章講述了JavaScript如何執行上下文,大家對JavaScript執行上下文不了解的話或者對JavaScript執行上下文感興趣的話那麼我們就一起來看看這篇文章吧, 好了廢話少說進入正題吧
背景:在面試中經常會遇到函數和變數提升,作用域等問題,如果想深入理解其原理,那麼首先要弄清楚函數執行上下文和執行上下文堆疊這兩個概念。
再次之前先介紹下堆疊的資料結構:
總結起來一句話:新的資料從堆疊頂部壓入,彈出資料也是從堆疊頂端彈出,也就是我們所說的彈夾原理。
#執行上下文可以理解為當前程式碼的執行環境,它會形成一個作用域。 JavaScript中的運作環境大概包含三種情況。
全域環境:JavaScript程式碼運作起來會先進入該環境
函數環境:當函數被呼叫執行時,會進入目前函數中執行程式碼
eval(不建議使用,可忽略)
JavaScript執行在單執行緒上,所以的程式碼都是排隊執行.棧底永遠都是全域上下文,而棧頂就是目前正在執行的上下文。當一開始瀏覽
器執行全域的程式碼,首先建立唯一的一個全域的執行上下文,並將其壓入執行棧的頂部(在瀏覽器關閉的時候出堆疊).當沒進入一個函數
的執行就會創建新的函數執行上下文,並相應的壓入執行棧的頂部.當前函數完成之後,當前函數的執行上下文從堆疊頂出棧,等待垃圾回來
收。
總的生命週期:建立-->執行-->出棧等待銷毀
建立階段:
#A 建立變數物件:首先初始化函數的參數arguments,初始化函數宣告,初始化變數(undefined)。 函數的優先權要高於變量,如果變
量和函數名重名,變數會被忽略。
a# 建立arguments物件,檢查上下文,初始化參數名稱和值並建立引用的複製。
b 掃描上下文的函數宣告(而非函數表達式)
1.每找到一個函數,在變數物件variableObject上建立一個屬性-----切確的說是函數的名字---屬性值就是指向該函數在記憶體中的位址的一個引用。
2.如果上述函數名稱已經存在於variableObject下,那麼對應的屬性值會被新的參考所覆寫。
c 掃描上下文的變數宣告
##1.每找到一個變數宣告,就會在變數物件上建立一個屬性---就是變數名稱字,並且將變數的值初始化為undefined
d.確定上下文內部this的指向
B 建立作用域鏈
執行階段:# 執行變數賦值,程式碼執行回收階段:
執行情境堆疊等待垃圾回收機制回收情境案例:下列程式碼用來說明執行情境堆疊的運作方式)
#
//变量声明 var a1 = 9, a2 = 8, a3 = "sss", b1 = {name:"xixi"}; //函数调用 a1 = f1(a1,a2); //函数声明 function f1(a,b){ //f1函数的执行上下文 /* 1.扫描参数: a = 9 b = 8 2.扫描函数声明 f2 = function(){} 3.扫描变量声明 t = undefined , m = undefined , i = undefined */ var t = 0, m = 10; for(var i=0;i<a;i++){ console.log(i); } function f2(){ console.log("f2"); } return a+b; }
環境堆疊示意圖:
#大家如果還不太了解的話,可以自己多實現兩邊就很容易掌握了哦!
相關推薦:
以上是詳細講述JavaScript執行上下文的詳細內容。更多資訊請關注PHP中文網其他相關文章!