Utility Typesで型変換(Partial,Required,Readonly,Pick…)

2022/11/15

Utility Typesを利用するとベースとなる型を変換して新しい型を定義できます。状況に合わせた目的の型を手軽に作れて便利です。ここでは、Utility Typesの中でも利用頻度の高そうなものについて取り上げます。

プロパティ属性を変更するのに活用

`Partial<Type>`
( 任意にする )

Partial<Type> を利用すると Type のプロパティは任意になります。

type SamplePartial = {
  x: string;
  y: string;
};

// プロパティは任意(optional)になる
let samplePartial: Partial<SamplePartial>;
samplePartial = { x: 'aaa', y: 'bbb' }; // OK
samplePartial = { x: 'aaa' }; // OK
samplePartial = { y: 'bbb' }; // OK

`Required<Type>`
( 必須にする )

Required<Type> を利用すると Type のプロパティは必須になります。

type SampleRequired = {
  x?: string;
  y?: string;
};

// プロパティは必須になる
let sampleRequired: Required<SampleRequired>;
sampleRequired = { x: 'aaa', y: 'bbb' }; // OK
sampleRequired = { x: 'aaa' }; // Error
sampleRequired = { y: 'bbb' }; // Error

`Readonly<Type>`
( readonlyにする )

Readonly<Type> を利用すると Type のプロパティはreadonlyになります。

type SampleReadonly = {
  x: string;
  y: string;
};

// プロパティはreadonlyになる
const sampleReadonly: Readonly<SampleReadonly> = { x: 'aaa', y: 'bbb' };
sampleReadonly.x = 'ccc'; // Error: Attempt to assign to const or readonly variable

必要なプロパティを変更するのに活用

`Pick<Type, Keys>`
( TypeからKeysを抽出 )

Pick<Type, Keys> を利用すると Type から Keys で指定したプロパティのみ抽出します。

type SamplePick = {
  x: string;
  y: string;
  z: string;
};

let samplePick: Pick<SamplePick, 'x' | 'y'>;

// ok
samplePick = {
  x: 'aaa',
  y: 'bbb',
};

// error
// Type '{ x: string; y: string; z: string; }' is not assignable to type 'Pick<SamplePick, "x" | "y">'.
// Object literal may only specify known properties, and 'z' does not exist in type 'Pick<SamplePick, "x" | "y">'.
samplePick = {
  x: 'aaa',
  y: 'bbb',
  z: 'ccc',
};

`Omit<Type, Keys>`
( TypeからKeysを取り除く )

Omit<Type, Keys> を利用すると Type から Keys で指定したプロパティを取り除きます。

type SampleOmit = {
  x: string;
  y: string;
  z: string;
};

let sampleOmit: Omit<SampleOmit, 'z'>;

// ok
sampleOmit = {
  x: 'aaa',
  y: 'bbb',
};

// error
sampleOmit = {
  x: 'aaa',
  y: 'bbb',
  z: 'ccc',
};

ユニオン型の変更に活用

`Extract<Type, Union>`
( ユニオン型に割り当てて抽出 )

Extract<Type, Union> を利用すると Type から Union に割り当て可能な内容のみを抽出します。

type SampleExtract = 'x' | 'y' | 'z';

let sampleExtract: Extract<SampleExtract, 'x' | 'y'>;
sampleExtract = 'x'; // ok
sampleExtract = 'y'; // ok
sampleExtract = 'z'; // Error: Type '"z"' is not assignable to type '"x" | "y"'.

`Exclude<Type, ExcludedUnion>`
( ユニオン型に割り当てて取り除く )

Exclude<Type, ExcludedUnion> を利用すると Type から ExcludedUnion に割り当て可能な内容を取り除きます。

type SampleExclude = 'x' | 'y' | 'z';

let sampleExclude: Exclude<SampleExclude, 'z'>;
sampleExclude = 'x'; // ok
sampleExclude = 'y'; // ok
sampleExclude = 'z'; // Error: Type '"z"' is not assignable to type '"x" | "y"'.