iT邦幫忙

鐵人檔案

2026 iThome 鐵人賽
回列表
JavaScript

30 天新世代 JavaScript 自我學習指南 系列

轉職接觸 JavaScript 三年,過去多在用 ES6/ES8 這批已經成熟的語法,或是各種包裝好的語法糖——能用就好,卻沒有真正回頭搞懂底層協議在解決什麼問題。

這系列想先複習那些自己還不夠熟、或當初被跳過的舊有特性與規範,像是迭代協議、Generator 甚至是非同步特性這些基礎,再延伸到 JS 新世代ES2023–2026 這幾年陸續推出的新特性,看看它們是怎麼建立在這些既有機制之上的並且如何使用。

AI 輔助開發愈來愈普及的現在,還是想留一點自己動手拆解、探索語言底層的樂趣, 以這系列延續上一次參賽時那趟自我探索學習之旅的精神。

參賽天數 22 天 | 共 22 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day 01|為什麼想重新學一次 JavaScript?

為什麼寫這個系列 兩年前剛轉職進入前端,大部分時間都在追進度。 Vue、Pinia、TypeScript、Nx monorepo、React Native、Re...

2026-09-05 ‧ 由 Rafael 分享
DAY 2

Day 02|為什麼 for...of 看得懂不同資料結構?

摘要 一句摘要:for...of 不需要認識 Array、Set 或字串的內部結構;它只找共同的 Symbol.iterator 入口。 前置知識:會使用...

2026-09-06 ‧ 由 Rafael 分享
DAY 3

Day 03|for...of 怎麼拿資料?next()、break 與提前離開時的收尾

摘要 一句摘要:for...of 從 Day 02 的 iterable 取得 iterator 後,會一次呼叫一次 next(); 如果我們用 break...

2026-09-07 ‧ 由 Rafael 分享
DAY 4

Day 04|Generator 的雙重身分:它同時是 Iterator 也是 Iterable

摘要 一句摘要:Generator 把手寫 iterator 的狀態管理改成順序程式碼;呼叫後得到的 generator 同時可 .next(),也可交給...

2026-09-08 ‧ 由 Rafael 分享
DAY 5

Day 05|資料何時才真的被產生?Iterator 的 pull 與 lazy 模式

摘要 一句摘要:Iterator 用 next() 讓 consumer 逐筆要求資料; 程式碼流程把工作延後到這個要求資料時才做時,才是真正的 lazy。 前...

2026-09-09 ‧ 由 Rafael 分享
DAY 6

Day 06|Iterator 也有 map / filter 了:ES2025 Iterator Helpers

摘要 一句摘要:ES2025 為既有的 Iterator 補上可串接的標準資料轉換 API。 前置知識:知道資料由 consumer 逐筆要求;需要時才處...

2026-09-10 ‧ 由 Rafael 分享
DAY 7

Day 07|Iterator Helpers:Lazy Pipeline 如何逐筆處理資料?

摘要 一句摘要:Iterator Helpers 會先接成處理管線;直到 consumer 要一筆資料,請求才會一路往上游 pull,值再逐步回到 cons...

2026-09-11 ‧ 由 Rafael 分享
DAY 8

Day 08|哪些 Iterator Helpers 真的會消費 Iterator?

摘要 一句摘要:map()、filter()、take() 只建立 lazy pipeline;直到 toArray()、reduce()、some() 等 c...

2026-09-12 ‧ 由 Rafael 分享
DAY 9

Day 09|Iterator 改變我看待程式執行的方式:從整批處理到 Lazy 資料流

摘要 一句摘要:Iterator 真正改變的不只是處理資料的 API,而是程式的執行方式:先描述資料怎麼流動,等 consumer 需要時才推進一步。...

2026-09-13 ‧ 由 Rafael 分享
DAY 10

Day 10|重新看 Promise:它不是非同步魔法,而是結果的狀態容器

摘要 一句摘要:回到 Promise 的核心:executor 同步執行、狀態只能前進,以及 reaction job 如何安排後續通知。 前置知識:理解函式、...

2026-09-14 ‧ 由 Rafael 分享