Typescriptの型で悩んだとき用小ネタメモ
2023/02/04
オブジェクト関連
オブジェクトのkeyの型指定
オブジェクトのプロパティそれぞれの型を指定しない場合などの指定方法。
以下のような指定が面倒な場合など。
type User = {
name: string
age : number
}
const user: User = { name: "sato",age:30 }
こんな感じで指定することができます。
type User = { [key: string]: string | number }
const user: User = { name: "sato" }
keyの指定をする場合は、key用の型をMapped Typesで割り当てます。
そのまま割り当てると初期値の設定する必要がある為?でOptional設定にします。
type Key = "name" | "age";
type User = { [key in Key]?: string | number }
const user: User = { name: "sato" }
ジェネリクス (generics)関連
ジェネリクスを利用すると、型を変数(引数？）のように扱うことができ、 抽象的な型指定ができるので、汎用的に利用することができます。
※「T」の指定は別の文字でも問題ないですが、Typeを表すTを使うのが一般的のようです。
type Item<T> = { value:T }
const item1:Item = {value:'my item'} // NG
const item2:Item<string> = {value:'my item'} // OK
const item３:Item<number> = {value:1} // OK
関数の引数の場合。
function func<T>(v1: T, v2: T): T {
return Math.random() <= 0.5 ? v1 : v2;
}
func<string>("○", "✗");
func<number>(1, 2);
使用できる型を限定する場合は、以下のようにextendsシグネチャを利用します。
type Item<T extends string | number> = {
value:T
}
const item1:Item<string> = {value:'my item'} // OK
const item2:Item<number> = {value:1} // OK
const item３:Item<boolean> = {value: true} // NG