iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

React 前端工程師的兩把刷子 系列

主線預計會寫「TypeScript」以及「React 前端測試」有關的內容。支線則是會根據當天所學到或看到的內容來即時分享。

鐵人鍊成 | 共 30 篇文章 | 104 人訂閱 訂閱系列文 RSS系列文 團隊鐵人賽臻融一
DAY 1

[Day01] 學了 React 後的下一步?準備好兩把刷子!

學了 React 之後的下一步,還能學什麼呢? 在今年的鐵人賽中,想要來分享這一兩年來開始使用的 TypeScript 和 React Testing 這兩把刷...

2021-09-16 ‧ 由 pjchender 分享
DAY 2

[Day02] TS: 泛型(Generics)能幹嘛?

「泛型(Generics)」是 TypeScript 中很常會使用到的功能,泛型的概念簡單來說,就是讓「型別」也變成一個變數,可以根據不同的情況套用不同的型別。...

2021-09-17 ‧ 由 pjchender 分享
DAY 3

[Day03] TS:泛型就。很。泛!用 extends 來加上一點限制吧!

昨天我們提到了泛型(generics)的使用,但泛型就像一個型別為 any 的變數一樣,使用者愛帶什麼型別都可以,基本上是沒有型別上的限制,但有些時候我們想要使...

2021-09-18 ‧ 由 pjchender 分享
DAY 4

[Day04] TS:如何把物件型別的所有屬性名稱取出變成 union type?試試看 keyof 吧!

前面兩天的文章中我們談到泛型(generics)的使用,以及如何透過 extends 來限制泛型可被帶入的型別。在後面的內容中,會越來越著重在如何透過 type...

2021-09-19 ‧ 由 pjchender 分享
DAY 5

[Day05] TS:如何把物件型別的所有屬性值取出變成 union type?試試 Indexed Access Types

昨天我們知道可以使用 keyof 的方式取出物件屬性 key,那麼如果我們是想要取出物件型別中屬性值的型別呢? 例如,有一個物件型別 Person 長這樣: t...

2021-09-20 ‧ 由 pjchender 分享
DAY 6

[Day06] TS:整合前幾天所學,來寫個 Generic Functions 吧!

這幾天的內容中,我們已經學到了幾個重點: 泛型(generics)的使用 使用 extends 限制泛型 keyof 的使用 Indexed Access...

2021-09-21 ‧ 由 pjchender 分享
DAY 7

[Day07] TS:什麼是 Utility Types?

上面這個是今天會提到的內容,如果你已經可以輕鬆看懂,歡迎直接左轉去看我同事 Andy 「前端工程師學習 DevOps 之路」的精彩文章!。 昨天我們整合了過去...

2021-09-22 ‧ 由 pjchender 分享
DAY 8

[Day08] TS:什麼!型別也能做條件判斷?認識 Conditional Types

上面這個是今天會提到的內容,如果你已經可以輕鬆看懂,歡迎直接左轉去看我隊友們的精彩文章! 昨天我們對於 Utility Types 有了更多認識,發現原來 U...

2021-09-23 ‧ 由 pjchender 分享
DAY 9

[Day09] TS:什麼!型別也有分配律?理解 Extract 和 Exclude 的實作

上面這個是今天會提到的內容,如果你已經可以輕鬆看懂,歡迎直接左轉去看我同事的精彩文章 — 「From State Machine to XState」! 前幾...

2021-09-24 ‧ 由 pjchender 分享
DAY 10

[Day10] TS:什麼!Conditional Types 中還能建立型別?使用 infer 來實作 ReturnType 和 Parameters

今天會來說明 TypeScript 中內建 ReturnType 和 Parameters 的原始碼(像是上圖這樣),如果你已經可以輕鬆看懂,歡迎直接左轉去看...

2021-09-25 ‧ 由 pjchender 分享