iT邦幫忙

2024 iThome 鐵人賽

DAY 2
0
JavaScript

TypeScript Type Challenges 冒險篇章:30 天闖關之旅,type 簡單了?你確定?系列 第 2

第2關:Hello World,遇見最熟悉的陌生人

  • 分享至 

  • xImage
  •  

第2關:Hello, World!

關卡簡介

Hello, World!

In Type Challenges, we use the type system itself to do the assertion.

For this challenge, you will need to change the following code to make the tests pass (no type check errors).

任務說明:

// expected to be string
type HelloWorld = any;

接下來,你的任務是讓下面的測試通過:

// you should make this work
type test = Expect<Equal<HelloWorld, string>>;

**注意:**你的目標是修改型別宣告,以確保不會出現型別檢查錯誤,並且讓測試順利通過。

冒險指南:

在這一題中,我們需要理解 Equal 和 Expect 的工作原理。Equal 是一個工具型別,用於比較兩個型別是否相等,而 Expect 則用於測試我們的推斷是否正確。通過修改 HelloWorld 的型別來滿足這些測試條件,是這關的核心目標。

關鍵字補給:

Type Assertion (型別斷言): 在 TypeScript 中,自動型別斷言(Automatic Type Assertion)就是編譯器會根據你寫的代碼自動猜出變數的型別,而不是讓你自己指定。例如,你賦值給一個變數,TypeScript 就會自動知道這個變數是什麼型別。這樣你可以少寫一些型別註解(Type Annotations),讓代碼更簡潔,同時也能讓開發過程更順利,減少出錯的機會。

Equal 工具型別: 這個工具型別會比較兩個型別是否相等,返回 true 或 false。例如,Equal<string, string> 會返回 true,而 Equal<string, number> 會返回 false。這裡是 Equal 的簡單實作(暫時不需深入理解,後續篇章將會更詳細探討):

export type Equal<X, Y> =
  (<T>() => T extends X ? 1 : 2) extends
  (<T>() => T extends Y ? 1 : 2) ? true : false

Expect 工具型別: Expect 用於測試型別斷言是否正確。如果 Expect 接收到的參數是 true,那麼測試就通過。這是它的基本實作(暫時不需深入理解,後續篇章將會更詳細探討):

export type Expect<T extends true> = T

通關方式:

我們應該將 HelloWorld 的型別從 any 修改為 string,以便讓測試通過。這是我們的第一步,未來的挑戰會基於這些基礎型別的理解繼續深入。

type HelloWorld = string;

type cases = [
  Expect<Equal<HelloWorld, string>>,
]

這樣,我們就能順利通過測試!

總結:

這一關帶領我們體驗了 TypeScript 型別系統的基本功,也讓大家熟悉接下來的闖關模式,了解我們如何通過 TypeScript 型別系統來解決問題準備好迎接下一個關卡吧!我們的型別冒險才剛剛開始!


上一篇
第1關:TypeScript 挑戰的序曲,踏上型別之旅
下一篇
第3關:Pick!TypeScript 撿寶術:用 Pick 精準撿取型別
系列文
TypeScript Type Challenges 冒險篇章:30 天闖關之旅,type 簡單了?你確定?13
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言