[TypeScript UtilityTypes] Awaited

TypeScript入門メモ
[Utility Types] Awaited について

Awaited

公式ドキュメント
https://www.typescriptlang.org/docs/handbook/utility-types.html#awaitedtype

この型は、非同期関数のawaitやPromisesの.then()メソッドのような操作、特にPromisesを再帰的にアンラップする方法をモデル化するためのものです。

type A = Awaited<Promise<string>>;
type A = string
 
type B = Awaited<Promise<Promise<number>>>;
type B = number
 
type C = Awaited<boolean | Promise<number>>; 
type C = number | boolean

使い所1

Awaited型は、特に複雑な型のPromiseに対して役立つ。
例えば、API呼び出しから得られるデータの型を取得する場合など

// API
type ApiResponse = Promise<{ data: string; count: number; }>;

type ResolvedApiResponse = Awaited<ApiResponse>;
// type ResolvedApiResponse = {
//   data: string;
//   count: number;
// }

使い所2

Awaited型はネストされたPromiseに対しても機能する。
例えば、Promise<Promise<string>>のようなネストされた型を解決することが可能

type NestedPromise = Promise<Promise<string>>;

type ResolvedNestedPromise = Awaited<NestedPromise>;
// type ResolvedNestedPromise = string

注意点

• Awaited型はPromiseに対してのみ機能する。Promiseでない型に対してAwaitedを使うと、その型自体がそのまま返される。
• TypeScriptがPromiseの型を推論できる状況でのみAwaited型を使うことが推奨される。

まとめ

非同期処理の結果を簡単に変換できそうなので、使いどことがあれば活用したい。