typescriptのジェネリック(generic)
on 開発
genericとは
ジェネリック(generic)はC#, Java等の言語で再利用性が高いコンポーネントを作る時に活用なるのが特徴です。
一つの型より複数の型で動作するコンポーネントを生成する時に使われます。
ジェネリック(generic)を使用するのはUnion Typeと同じ感じでパラメータやreturn値等一つの型ではない場合にtypescriptではany
を使うのが一般的ですが、
ジェネリック(generic)を使う時はUnion Typeと同じく再利用性に良いです。
文字や数字、Booleanの値を出力する関数はジェネリック(generic)をどうやって使うのか見てみましょう。
function unionTypeFunc(parameter: string | number) {
function printText(x: any): any {
return x;
}
function printText<T>(x: T): T {
return x;
}
printText('hello'); // 'hello'
printText(30); // 30
printText(false); // false
}
any
型でした場合はtype checker
をしないので今後runtime errorになる問題が高いです。
しかし、ジェネリック(generic)を利用すればtype checker
だけではなくアーギュメントに合わせてreturn値も設定が可能です。
※ジェネリックのT
はType
を意味します。二つのジェネリックを書く場合はT
とU
を使うのが一般的です。
Generic Type
functionを利用してGenericのinterfaceを作るのが可能です。
#1と#2のような形で実装するのが可能です。
関数で定義した際はJavascriptの関数宣言と一緒で変数にした場合は関数式と同じです。
// 関数宣言
function printText<T>(text: T): T {
return text;
}
// #1 関数式
let str: <T>(text: T) => T = printText;
// #2 関数式
let str: {<T>(text: T): T} = printText;