閉包 (Closure) 是什麼?
閉包是函式的組合,並會將函式宣告時參考到的作用域環境變數保存下來。常被使用在 event-base 的情況 (例如點擊) 和非同步函式中。
自己遇過的情況是,前公司課程中有文法說明,會以音檔搭配動畫呈現,資料型態是 Array,包含文案和顯示時間,作法使用基本的 for 迴圈巡列,並等待給定的秒數後依序顯示。形成了一個 for 包住 setTimeout 的狀況,如果沒有用閉包將狀態存起來,就沒辦法呈現正確的結果。
延伸閱讀:
1. MDN 閉包
原型鍊 (Prototype chain)是什麼?
在創造實體、變數時,JS 會透過 __proto__ 將實體連結到它的原型 (prototype),當使用一個實體找不到的方法或屬性時,JS 機制會透過 __proto__ 一層層往上找,這樣串起來的過程就是原型鍊 (Prototype chain),並可以透過此方式實現繼承的概念。
自己的經驗是,前公司的影片片源除了 Youtube 以外,還有自製的教學影片,兩者會採用不同的 API,但仍有許多共通的方法,例如播放、停止、顯示中英文字幕等。我便將共通的方法寫在 player.prototype 裡,實作時再根據不同的片源將實體 new 出。
this 是什麼?
指向調用函式的物件,找不到時就會指向全域如 window。
bind(), call(), apply()
function.bind() 可以讓 function 中的 this 指向指定的物件,如果要使用要加括號。
call 和 apply 雷同,除綁定外會直接執行,但 apply 參數是吃 array。
函式.bind(物件)();
函式.call(物件, 參數1, 參數2);
函式.apply(物件, [參數1, 參數2]);
延伸閱讀:
1. [筆記] 了解function borrowing和function currying ─ bind(), call(), apply() 的應用
Event Loop
監控 Stack 和 Task Queue,當 Stack 空了會把 Task Queue 裡面的任務拉到 Stack 執行。異步 (如 setTimeout、AJAX 請求) 或滑鼠事件的 Click Callback 都會放在 Queue 中。
延伸閱讀:
1. [筆記] 理解 JavaScript 中的事件循環、堆疊、佇列和併發模式
2. JavaScript 運行機制詳解:再談Event Loop
待續… fetch(), promise, react, redux