TypeScript: typeof, keyof [アウトプット全くしてこなかったのでアウトプットする002]

6201 ワード
TypeScript アウトプット駆動生活 TypeScript テキストリンク

あんまりわかっていないので調べました。

typeof

TypeScriptの"typeofは変数から型を抽出する型演算子です"。次は、変数pointにtypeof演算子を用いて、Point型を定義する例です。

const point = { x: 135, y: 35 };
type Point = typeof point;
// このPoint型は次のような型になります。

type Point = {
  x: number;
  y: number;
};

keyof

keyofは"オブジェクト型からプロパティ名を型として返す型演算子"です。たとえば、nameプロパティを持つ型に対して、keyofを使うと文字列リテラル型の"name"が得られます。

type Person = {
  name: string;
};
type PersonKey = keyof Person;
// 上は次と同じ意味です
type PersonKey = "name";

keyofは型に対して行う

type Colors = {
  red: 'red',
  blue: 'blue'
}

type ColorsKey = keyof Colors;

typeofは値に対して行う

const colors = {
  red: 'red',
  blue: 'blue'
}

type Colors = typeof colors;

keyof typeofをするとユニオンタイプになる

const colors = {
  red: 'red',
  blue: 'blue'
}
type Colors = keyof typeof colors;

ただColors.と打った時にサジェストが出てこない。

以下のようにするとサジェスト出てくる

const Colors = {
  red: 'red',
  blue: 'blue'
} as const;
type Colors = typeof Colors[keyof typeof Colors];
Colors.red

強くなりたい!!!!!!

参考