誰でもできる type-challenges入門 2024/10/29 ココカラ勉強会

フロントエンドエンジニア 谷 郁弥（high-g）

いきなりですが、質問です declare function PromiseAll(values: readonly [...T]): Promise<{ [P in keyof T]: T[P] extends Promise | infer R ? R : never }> 下記の型定義で何をしているか理解できますか？ もし、少しでも理解できない部分があるなら、、、 type-challengesをやりましょう！

type-challengesとは？ TypeScriptの型システムを理解しながら、楽しく型の表現力を身につけられるゲーム 例題 // 条件 C が true 型のときは型 T を、false 型のときは型 F を返す If 型を実装しなさい type If = any 正解 type If = C extends true ? T : F 初見殺し、、、知識がないと難しい 🐱

type-challengesの攻略に必要な４つの基礎知識 Conditional Types（条件型、型の条件分岐） A extends ◯◯ ? T : F Generic Constraints（型引数の制約、ジェネリック制約） type If Mapped Types（マップ型、インデックス操作型） { [P in keyof T]: T[P] }; infer（推論） type ElementType = T extends (infer U)[] ? U : never; type ReturnType = T extends (...args: any[]) => infer R ? R : never; declare function PromiseAll(values: readonly [...T]): Promise<{ [P in keyof T]: T[P] extends Promise | infer R ? R : never }> ちょっと読めるようになったのでは・・・？

戦いは終わらない type-challengesで強くなりましょう