TypeScript: ジェネリック関数の型パラメータを書く位置は、引数カッコの直前

本稿ではTypeScriptで、ジェネリック関数を定義するときに、型パラメータはどこに書いたら良いかを説明する。

要約

結論としては、どんな関数の書き方であっても、型パラメータ<T>は、仮引数のカッコの前に書けば良い。

<T> (value: T) => {} // アロー関数

function f<T>(value: T) {} // 関数

function <T>(value: T) {} // 匿名関数

{
  f<T>(value: T) {} // メソッド
}

アロー関数と型パラメータ

ジェネリクスの型パラメータをアロー関数で使う場合は、仮引数のカッコの前に書く。

const f = <T> (value: T) => {}
//        ^^^ ここに型パラメータを書く

f<string>('string')
f<number>('string') // 🚫コンパイルエラー

関数と型パラメータ

関数に型パラメータを使う場合は、関数名の後、仮引数のカッコの前に書く。

function f<T>(value: T) {}
//        ^^^ ここに型パラメータを書く

f<string>('string')
f<number>('string') // 🚫コンパイルエラー

匿名関数の場合は、仮引数のカッコの前に書く。

const f = function <T>(value: T) {}
//                 ^^^ ここに型パラメータを書く

メソッドと型パラメータ

メソッドに型パラメータを用いる場合は、メソッド名の後、仮引数のカッコの前に書く。

const obj = {
  f<T>(value: T) {}
// ^^^ ここに型パラメータを書く
}

obj.f<string>("string");
obj.f<number>("string"); // 🚫コンパイルエラー