Dev

程式碼之外，還有生活的藝術前端工程師 / 攝影 / 生活紀錄

文章150
標籤70

標籤查看更多

分類查看更多

前端技術、踩坑紀錄與學習筆記

148 篇

2026-05-1511 分鐘閱讀

ES5 Callback 模式的侷限，與 ES6 Promises 的登場

整理 ES5 callback 模式的三個侷限：無法在 JavaScript 內追蹤背景工作狀態、回應資料僅存在於 callback 內部、流程不直觀。並介紹 ES6 的 `fetch` 作為雙管齊下的幻象函式，如何同時發起背景工作並立即回傳 Promise 物件，解決上述問題。

JavaScript Hard Parts v3

#JavaScript #Promise #frontendMasters #javaScriptTheHardPartsV3

2026-05-1514 分鐘閱讀

Event Loop：JavaScript 非同步執行的調度核心

說明 Event Loop 的運作原理：它持續檢查 Call Stack 是否清空、全域程式碼是否執行完畢、Callback Queue 是否有待執行的函式，並在三個條件同時成立後才將回呼送上 Call Stack。同時整理 JavaScript 非同步執行模型的完整架構，包含 JavaScript 引擎、Web Browser APIs、Callback Queue 與 Event Loop 之間的分工。

JavaScript Hard Parts v3

#JavaScript #EventLoop #frontendMasters #javaScriptTheHardPartsV3

2026-05-1413 分鐘閱讀

Callback Queue 與執行規則：非同步回呼如何回到 JavaScript

說明 Callback Queue（Task Queue）的運作機制與嚴格的執行條件：來自 Web Browser APIs 的回呼函式不會直接回到 Call Stack，而是進入佇列等候，直到所有全域程式碼執行完畢後才能執行。並以 `setTimeout(fn, 0)` 搭配同步阻塞函式的範例，逐步拆解實際的輸出順序。

JavaScript Hard Parts v3

#JavaScript #CallbackQueue #frontendMasters #javaScriptTheHardPartsV3

2026-05-1412 分鐘閱讀

Callback Function 與 Web Browser APIs 的運作原理

逐步拆解 `setTimeout` 在 JavaScript 引擎與瀏覽器之間的實際分工：說明 Facade Function 如何將計時工作外包給瀏覽器 Timer API，以及為何主執行緒不會等待計時完成，進而解釋非直覺的輸出順序。

JavaScript Hard Parts v3

#JavaScript #CallbackFunction #WebAPI #frontendMasters #javaScriptTheHardPartsV3

2026-05-1314 分鐘閱讀

Promises、Async 與 Event Loop：為什麼 JavaScript 需要非同步機制

說明 JavaScript 單執行緒同步執行模型的限制，以及耗時任務如何造成阻塞問題。介紹瀏覽器提供的 Web APIs（`setTimeout`、`fetch` 等）本質上是 Facade Functions，並預告 Event Loop 與 Callback Queue 的排程機制。

JavaScript Hard Parts v3

#JavaScript #frontendMasters #javaScriptTheHardPartsV3

2026-05-1315 分鐘閱讀

hint 參數、Symbol 本質與元程式設計

說明 JavaScript 引擎執行 @@toPrimitive 時自動傳入的 hint 參數機制，介紹 Symbol 作為半隱藏唯一識別符的設計動機，以及 Well-Known Symbols 如何讓開發者安全地覆寫語言內建行為，實現元程式設計。

JavaScript Hard Parts v3

#JavaScript #Symbol #TypeCoercion #Metaprogramming #frontendMasters #javaScriptTheHardPartsV3

2026-05-1213 分鐘閱讀

Symbol 與手動控制 ToPrimitive 強制轉換

說明為何普通物件無法直接定義 @@toPrimitive 隱藏屬性，以及如何透過 Symbol.toPrimitive 搭配方括號記法手動介入強制轉換流程，實現元程式設計的核心概念。

JavaScript Hard Parts v3

#JavaScript #TypeCoercion #Symbol #frontendMasters #javaScriptTheHardPartsV3

2026-05-124 分鐘閱讀

ToPrimitive 強制轉換與 `@@toPrimitive` 隱藏屬性

介紹 JavaScript 第四條強制轉換流程 ToPrimitive：當運算元為物件時如何透過 @@toPrimitive 隱藏屬性取得原始型別值，以及 hint 機制如何決定轉換目標，並以 Date 物件相減為核心範例說明。

JavaScript Hard Parts v3

#JavaScript #TypeCoercion #frontendMasters #javaScriptTheHardPartsV3

2026-05-1110 分鐘閱讀

Date 物件的隱藏屬性 `[[DateValue]]` 與方括號記法動態存取

介紹 JavaScript Date 物件內部的 [[DateValue]] 隱藏屬性與 Unix Epoch 時間戳記，並說明方括號記法如何對變數求值以動態決定屬性名稱，作為元程式設計的前置概念。

JavaScript Hard Parts v3

#JavaScript #Date #frontendMasters #javaScriptTheHardPartsV3

2026-05-1112 分鐘閱讀

JavaScript 記憶體模型：原始型別、Stack 與 Heap、物件參考比較

說明 JavaScript 原始型別與物件在記憶體中的儲存差異：原始型別直接存於 Stack，物件存於 Heap 並以參考存取。解析為何用 == 或 === 比較內容相同的兩個物件仍回傳 false，以及賦值複製的是參考而非物件本身。

JavaScript Hard Parts v3

#JavaScript #ReferenceType #frontendMasters #javaScriptTheHardPartsV3

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15