TypeSceipt学習。
自分向けの備忘録。
ジェネリクスって
汎用的なメソッドに対して特定の型を紐付けるための仕組み。
宣言する方法それぞれ
// <T>はジェネリクスの宣言、抽象的な型を意味する
// アロー関数
const echo = <T>(arg: T): T => {
return arg;
};
// function関数式
const echo = function <T>(arg: T): T {
return arg;
};
// 呼び出し側で型を指定し、引数を渡す。
console.log(echo<number>(100));
// メソッド記法
const echo3 = {
echo<T>(arg: T): T {
return arg;
},
};
console.log(echo3.echo<number>(100));
呼び出し側で型引数の指定は省略することができる。その場合型推論にて補われる。
複数宣言する
複数の型引数を宣言することも可能。
const echo4 = <T, P, U>(x: T, y: P, z: U) => {
return [x, y, z];
};
//型string,number,booleanをそれぞれ宣言
console.log(echo4("foo", 123, true));
下記の場合それぞれ別の型の引数を割り当てるが、型引数はstringに推論されるためエラーとなる。
// 全てT型で統一
const echo4 = <T>(x: T, y: T, z: T) => {
return [x, y, z];
};
// string型と推論されるため、二番目の引数でエラーとなる
// エラー:型 '123' の引数を型 'string' のパラメーターに割り当てることはできません。
console.log(echo4("foo", 123, true));
クラスの書き方
class Mirror<T> {
constructor(public value: T) {}
echo(): T {
return this.value;
}
}
console.log(new Mirror<number>(123).echo());
console.log(new Mirror<string>("T").echo());
console.log(new Mirror<boolean>(true).echo());
参考:
TypeScript入門
Udemy[JavaScriptエンジニアのためのハンズオンで学ぶTypeScript徹底入門2024年最新版]
c.sakyou