Genericsの型引数が複数あるパターン
TypeScript
Genericsの型引数が複数あるパターン
以下のようにカンマ区切りで記述する。
const foo = <T, K, U>( foo: T, bar: K, baz: U) => {
return {};
}
また、以下のように型引数それぞれに初期値やextendsの制約を付け加えることも出来る。
const foo = <T extends string, K extends number, U = boolean>( foo: T, bar: K, baz: U) => {
return {};
}
Lookup Types
以下のようにT[K]の構文で記述する。
const foo = <T extends string, K extends number, U = boolean>( foo: T, bar: K, baz: U) => {
return {};
}
type Obj = {
a: number
b: boolean
}
type Foo = Obj["a"]
GenericsとLookup Typesが合わさったパターン
第一引数のTは第二引数で用いることができる。 extendsとkeyofを用いて、オブジェクトTのkeyをKに制約している。 それにより、Lookup Typesのobj[key]でエラーが出なくなる。
const getProperty = <T, K extends keyof T>( obj: T, key: K) => {
return obj[key];
}
const obj = {
foo: 1,
bar: 2,
baz: 3,
}
const hoge = getProperty(obj, "bar")
// const hoge: number
また、setPropertyまた、の例として以下のように記述する。 第三引数にvalue: T[K]とすることで、valueはnumber型となる。
const getProperty = <T, K extends keyof T>( obj: T, key: K) => {
return obj[key];
}
const setProperty = <T, K extends keyof T>( obj: T, key: K, value: T[K]) => {
obj[key] = value;
}
const obj = {
foo: 1,
bar: 2,
baz: 3,
}
const hoge = getProperty(obj, "bar")
setProperty(obj, "bar", 100);
JavaScriptで用いられるGenerics
map関数
map関数の場合、以下のように型推論が上手く動いている。 map自体がGenericsになっていて、暗黙的な型解決でうまく推論してくれている。