💊
[TypeScript] 関数内で扱う型を引数のように受け取るジェネリクス関数
はじめに
この記事では、TypeScriptのジェネリクス関数 をまとめております。
参考資料
結論
1. それぞれのデータ型で関数を作成する
// 数値型の配列の末尾のデータを取得する関数
const getEndElementOfNum = (list: number[]) => list.at(-1);
// 文字列型の配列の末尾のデータを取得する関数
const getEndElementOfStr = (list: string[]) => list.at(-1);
console.log(getEndElementOfNum([1, 2, 3, 4]));
console.log(getEndElementOfStr(['a', 'b', 'c']));
実行結果を確認する
4
c
2. any型で共有化
// 配列の末尾のデータを取得する関数
const getEndElementOfAny = (list: any[]) => list.at(-1);
console.log(getEndElementOfAny([1, 2, 3, 4]));
console.log(getEndElementOfAny(['a', 'b', 'c']));
実行結果を確認する
4
c
3. ジェネリック関数
const getEndElement = <T>(list: T[]) => list.at(-1);
console.log(getEndElement<number>([1, 2, 3, 4]));
console.log(getEndElement<string>(['a', 'b', 'c']));
実行結果を確認する
4
c
4. 複数の型引数の活用
const getEndElement1 = <T, U>(arg1: T, arg2: U) => {
console.log(arg1, typeof arg1);
console.log(arg2, typeof arg2);
}
getEndElement1(1, 'a')
実行結果を確認する
1 number
a string
Discussion