作用域及閉包 講到作用域,你會想到什麼?當然是執行上下文。每個函式都有自己的 excution context,和 variable object。這些環境用於儲存上下文中的變數,函式宣告,引數等。
this 本質上來說,在 js 裡 this 是一個指向函式執行環境的指標。this 永遠指向最後呼叫它的物件,並且在執行時才能獲取值,定義是無法確認他的值。

1.1 this 有多種使用場景,下面主要介紹 4 個使用場景:
- 作為建構函式執行




call,apply,bind 的執行方式如上例所示。call,apply 都是改變上下文中的 this,並且是立即執行的。bind 方法可以讓對應的函式想什麼時候呼叫就什麼時候呼叫。
閉包 閉包的概念很抽象,看下面的例子你就會理解什麼叫閉包了:

非同步和單執行緒
我們先感受下非同步。

為什麼會產生非同步呢?
首先因為 js 為單執行緒,也就是說 CPU 同一時間只能處理一個事務。得按順序,一個一個處理。
如上例所示,第一步:執行第一行列印 “start”;第二步:執行 setTimeout,將其中的函式分存起來,等待時間結束後執行;第三步:執行最後一行,列印 “end”;第四部:處於空閒狀態,檢視暫存中,是否有可執行的函式;第五步:執行分存函式。
為什麼 js 引擎是單執行緒?
js 的主要用途是與使用者互動,以及操作 DOM,這決定它只能是單執行緒。例:一個執行緒要新增 DOM 節點,一個執行緒要刪減 DOM 節點,容易造成分歧。
為了更好使用多 CPU,H5 提供了 web Worker 標準,允許 js 建立多執行緒,但是子執行緒受到主執行緒控制,而且不得操作 DOM。
任務列隊
單執行緒就意味著,所有的任務都要排隊,前一個結束,才會執行後面的任務。如果列隊是因為計算量大,CPU 忙不過來,倒也算了。但是更多的時候,CPU 是閒置的,因為 IO 裝置處理得很慢,例如 ajax 讀取網路資料。js 設計者便想到,主執行緒完全可以不管 IO 裝置,將其掛起,然後執行後面的任務。等後面的任務結束掉,在反過頭來處理掛起的任務。
好,我們來梳理一下:
1)所有的同步任務都在主執行緒上執行,行程一個執行棧。
2)除了主執行緒之外,還存在一個任務列隊,只要一步任務有了執行結果,就在任務列隊中植入一個時間。
3)主執行緒完成所有任務,就會讀取列隊任務,並將其執行。
4)重複上面三步。
只要主執行緒空了,就會讀取任務列隊,這就是 js 的執行機制,也被稱為 event loop(事件迴圈)。
有任何疑惑加群QQ786276452
對前端的技術,架構技術感興趣的同學關注我的頭條號,並在後臺私信傳送關鍵字:“前端”即可獲取免費的架構師學習資料
知識體系已整理好(原始碼,筆記,PPT,學習視訊),歡迎免費領取。還有面試視訊分享可以免費獲取。關注我,可以獲得沒有的架構經驗哦!!