0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

TypeScript: Mapped Typesの中身を言語化してみる① [アウトプット全くしてこなかったのでアウトプットする015]

Posted at

Mapped Types言語化するのが勉強になりそうだとふと感じたのでアウトプットします。

Partial

image.png

Partial.d.ts
type Partial<T> = {
    [P in keyof T]?: T[P];
};

ジェネリクスで型Tを受け取り、in keyofでTのkeyをプロパティPに渡しています。
また全てのプロパティはoptional型となります。。

Required

image.png

Required.d.ts
type Required<T> = {
    [P in keyof T]-?: T[P];
};

ジェネリクスで型Tを受け取り、in keyofでTのkeyをプロパティPに渡しています。
ここは同じ。だけど[P in keyof T]-?-?の部分でoptional型をなくして必須プロパティにしています。
-?は使ったことがないので自分の引き出しに増えて嬉しい。リバースエンジニアリングをする恩恵です。

Readonly

image.png

Readonly.d.ts
type Readonly<T> = {
    readonly [P in keyof T]: T[P];
};

ジェネリクスで型Tを受け取り、in keyofでTのkeyをプロパティPに渡しています。
全てのプロパティに対して読み取り専用のreadonly修飾子をつけています。

Pick

image.png

Pick.d.ts
type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

Pickには2つのジェネリクスを渡します。
1つ目は型、2つ目は1つ目のジェネリクスに渡した型のサブタイプのプロパティ
[P in K]ここの部分のKには "hoge" | "fuga"のようなプロパティ名が入ってくるのでそれをK extends keyof Tで行っています。
またT[P]で絶対に型情報が欲しいのですが、それはK extends keyof Tで担保されています。

Record

image.png

Record.d.ts
type Record<K extends keyof any, T> = {
    [P in K]: T;
};

1つ目のジェネリクスであるKにはどんなプロパティでも渡せます(ただしユニオン型で)。Tには型情報を渡します(こちらも複数の場合はユニオン型で)。
全てのプロパティに対して同じ型情報を渡すというものです。

Exclude,Extract

image.png
image.png

ExcludeAndExtract.d.ts
type Exclude<T, U> = T extends U ? never : T;
type Extract<T, U> = T extends U ? T : never;

この2つの原理はほぼ同じなので合わせて言語化します。
まず両方ともジェネリクスに2つ渡します。
1つ目の方には型を渡します。2つ目の方にも型を渡していて、
ExcludeはTの型がUのサブタイプであればneverを返す
逆にExtractの方はTの型がUのサブタイプであればTを返す
となっています。

関連記事

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?