TypeScript: <T>の書く位置チートシート

この投稿はTypeScriptのジェネリクスの型変数(type parameter)をどこに書くのかのチートシートです。

<T>の書く位置まとめ

• 関数宣言
• 関数式
• アロー関数
• メソッド宣言
• 関数型
• コンストラクタ型
• 関数シグネチャ
• コンストラクタシグネチャ:
  • 引数リスト()の直前
• クラス宣言
• インターフェース宣言
• 型エイリアス:
  • 識別子の直後

<T>の書く位置チートシート

関数宣言

function name<T>() {}

関数式

const name = function <T>() {};
const name = function* <T>() {}; // ジェネレーター
const name = function name<T>() {}; // 名前付き関数式

アロー関数

const name = <T>() => {};
const name = <T,>() => {}; // コンパイラオプションのjsxがnone以外のときは、JSXと解釈されないように「,」を書く
const name = async <T>() => {}; // 非同期関数
const a = {
  method: <T>() => {},
};

クラス宣言

class Name<T> {}

メソッド宣言

// クラス宣言
class Name {
  method<T>() {}
}

// オブジェクトリテラル
const a = {
  method<T>() {},
};

インターフェース

interface Name<T> {}

メソッドシグネチャ

// インターフェース宣言
interface Name {
  method<T>();
}

// 型エイリアス
type A = {
  method<T>();
};

関数シグネチャ

type A = { <T>(): any };

コンストラクタシグネチャ

type A = { new <T>(): any };

関数型

type A = <T>() => any;

コンストラクタ型

type A = new <T>() => any;

型エイリアス

type A<T> = any;