TypeScript: 関数使用時にtypeはどこに書くのか迷ったときのためのカンニングペーパー
functionを書くときのtypeの書く位置がわからずいつも困るので、今日はカンペを作ろう。
パターン1
TypeScript
function add(a: number, b: number): number {
return a + b;
}
TypeScript
//ジェネリクスの場合
function add<T>(a: T, b: T): T {
return a + b;
}
パターン2
TypeScript
const add = function (a: number, b: number): number {
return a + b;
};
TypeScript
//ジェネリクスの場合
const add = function<T>(a: T, b: T): T {
return a + b;
};
パターン3
TypeScript
const add = (a: number, b: number): number => a + b;
TypeScript
//ジェネリクスの場合
const add = <T>(a: T, b: T): T => a + b;
パターン4
TypeScript
//関数型を定義してからその型を持つ変数に関数を代入
type AddFunction = (a: number, b: number) => number;
const add: AddFunction = (a, b) => a + b;
TypeScript
//ジェネリクスの場合
type AddFunction<T> = (a: T, b: T) => T;
const add: AddFunction<number> = (a, b) => a + b;
パターン5
TypeScript
//インターフェース内で関数の型を定義し、その型を持つ変数に関数を代入
interface AddFunction {
(a: number, b: number): number;
}
const add: AddFunction = (a, b) => a + b;
TypeScript
//ジェネリクスの場合
interface AddFunction<T> {
(a: T, b: T): T;
}
const add: AddFunction<string> = (a, b) => a + b;
以上。
パターン4は今日まで知らなかったし、正直、インターフェースやジェネリクスについてまだよく分かってない。でもこのカンニングペーパーを見ながら、真似して書いているうちにそのうち慣れるでしょ、きっと。未来の自分に期待。
11月に入ったというのにまだ半袖で過ごしている。
去年の今頃はもうコートを着ていたのに。