JavaScript の静的に型指定されたスーパーセットである TypeScript は、エラーを早期に検出し、コードの可読性を向上させる機能により、技術コミュニティで絶大な人気を得ています。 TypeScript の強力な機能の 1 つは infer キーワードです。これにより、開発者はより表現力豊かで動的な型を作成できます。
TypeScript 2.8 で導入された infer キーワードは、一時的な型変数を作成するために条件付き型内で使用されます。これらの型変数を使用して、条件付き型の true または false 分岐内の型を推論できます。 infer キーワードを使用すると、TypeScript が使用されるコンテキストに基づいて特定の型を決定できるため、開発者はより動的で表現力豊かな型を作成できます。
推論の仕組みをよりよく理解するために、条件型の基本構文を見てみましょう。
type MyConditionalType<T> = T extends SomeType ? TrueType : FalseType;
この例では、T はジェネリック型パラメーターであり、SomeType は T が比較される型を表します。 T が SomeType を拡張する場合、MyConditionalType
ここで、infer キーワードをミックスに導入しましょう:
type MyInferredType<T> = T extends SomeType<infer U> ? U : FalseType;
ここでは、infer キーワードを使用して、条件型の true 分岐内に一時的な型変数 U を作成します。 T が SomeType を拡張する場合、TypeScript は T の型に基づいて U の型を推測しようとします。
ReturnType は、関数の戻り値の型を抽出するユーティリティ型です。これは、infer キーワードを使用して動的タイプを作成する方法を示す完璧な例です。 ReturnType の定義は次のとおりです:
type ReturnType<T extends (...args: any[]) => any> = T extends (...args: any[]) => infer R ? R : any;
この定義では、T は任意の数の引数を受け取り、任意の型を返す関数型です。 infer キーワードを使用して、関数の戻り値の型を表す一時的な型変数 R を作成します。 T が関数の場合、TypeScript は戻り値の型を推測し、それを R に割り当てます。
ReturnType の動作を見てみましょう:
function greet(name: string): string {
return `Hello, ${name}!`;
}
type GreetReturnType = ReturnType<typeof greet>; // GreetReturnType is inferred as 'string'
ここでは、ReturnType を使用して、greet 関数の戻り値の型 (文字列) を推測します。
infer キーワードを利用するもう 1 つの便利なユーティリティ タイプはパラメータです。この型は、関数のパラメータの型をタプルとして抽出します。パラメータの定義は次のとおりです:
type Parameters<T extends (...args: any[]) => any> = T extends (...args: infer P) => any ? P : never;
この例では、関数のパラメーターの型を表す一時型変数 P を作成します。 T が関数の場合、TypeScript はパラメーターの型を推測し、それらをタプルとして P に割り当てます。
パラメータを使用した例を見てみましょう:
function add(a: number, b: number): number {
return a + b;
}
type AddParameters = Parameters<typeof add>; // AddParameters is inferred as [number, number]
ここでは、Parameters を使用して、add 関数のパラメーターの型 (タプル [number,number]) を推論します。
PromiseType ユーティリティ タイプを使用して、Promise が解決されるタイプを抽出できます。これは、非同期関数を扱う場合に特に便利です。 PromiseType の定義は次のとおりです:
type PromiseType<T extends Promise<any>> = T extends Promise<infer U> ? U : never;
この例では、Promise が解決される型を表す一時型変数 U を作成します。 T が Promise の場合、TypeScript は解決された型を推測し、それを U に割り当てます。例を次に示します。
async function fetchData(): Promise<string> {
return "Fetched data";
}
type FetchedDataType = PromiseType<ReturnType<typeof fetchData>>; // FetchedDataType is inferred as 'string'
この場合、PromiseType は、fetchData 関数の Promise が解決する型 (文字列) を推論するために使用されます。
UnboxArray ユーティリティ タイプを使用して、配列内の要素のタイプを抽出できます。 UnboxArray の定義は次のとおりです:
type UnboxArray<T extends Array<any>> = T extends Array<infer U> ? U : never;
この例では、配列内の要素の型を表す一時的な型変数 U を作成します。 T が配列の場合、TypeScript は要素の型を推測して U に割り当てます。例:
type MyArray = number[]; type ElementType = UnboxArray<MyArray>; // ElementType is inferred as 'number'
ここでは、UnboxArray を使用して、MyArray 型内の要素の型 (数値) を推測します。
infer キーワードは非常に強力ですが、いくつかの制限があります。
条件型内でのみ使用できます。
特に複雑な型や再帰型を扱う場合、TypeScript が正しい型を推論できるとは限りません。このような場合、開発者は、TypeScript が正しい型を推測できるように、追加の型アノテーションを提供するか、型をリファクタリングする必要がある場合があります。
推論の力を理解して活用することで、より柔軟な TypeScript プロジェクトを作成できます。今すぐ、ツールキットに infer キーワードを組み込む検討を始めてください。
これが役立つと思われた場合は、 ニュースレターの購読を検討してください Web 開発に関するさらに役立つ記事やツールをご覧ください。読んでいただきありがとうございます!
以上是理解 TypeScript 中的 infer 关键字的详细内容。更多信息请关注PHP中文网其他相关文章！
