見出し画像

基礎からのTypeScript[インターフェース⑶]

外資系企業でソフトウェアエンジニアをしております、タロイモと言います。今日もよろしくお願いします。

TypeScriptの文法について解説しています。
今回は第六回、最終回としてTypeScriptインターフェースのユーティリティ型を説明していきます。

ユーティリティ型とは

TypeScriptには、一般的な型変換(Mapped Type, Conditional Type)を容易にするためのユーティリティ型というものがいくつか用意されています。

Mapped Type等の型変換を簡単にしたものと捉えて良いでしょう。

関数の引数や返り値の型から新しい型を生成

Parameters<T>
関数の引数の型から新しい型を抽出します。
今回はcal関数の引数の型はstringとnumberなので、[string, number]型が生成されます。

function cal(height: string, width: number): number => {
 return parseInt(height) * width
};

type TypeA = Parameters<typeof cal>; // [string, number]

ReturnType<T>
関数の返り値の型から新しい型を抽出します。

function cal(height: string, width: number): number => {
 return parseInt(height) * width
};

type TypeB = ReturnType<typeof cal>; //[number]

ConstructorParameters<T>
コンストラクタの引数からも同様に型を抽出できます。

class Parallelogram implements Square {
   width: number; 
   height: number;
   
   constructor(_width: number, _height: number){
       this.width = _width;
       this.height = _height;
   }

   getArea(): string {
       return `平行四辺形の面積は${this.width * this.height}です。`;
   }
}

type TypeC = ConstructorParameters<typeof Parallelogram>; // [number, number]

プロパティの設定

Readonly<T>
読み取り専用のプロパティを持つ型を生成します。
以下はFruit型のプロパティが読み取り専用になります。

interface Fruit {
  name:string;
  color: string;
}

let lemon: ReadOnly<Fruit> = {
  name: "レモン",
  color: "yellow"
};

lemon.name = "ミカン"; //エラー

指定の型を持つプロパティを作成

Record<K, T>
"Kで指定した型を持つプロパティ"の型を生成します。
以下は、number型のプロパティの値がFruit型のオブジェクトになります。

オブジェクト = {プロパティ: 値}
interface Fruit {
  name:string;
  color: string;
}

let lemon: Record<number, Fruit> = {
  {1: {name: "レモン",
  color: "yellow"}},
  {2: {name: "ミカン",
  color: "orange"}},
  {3: {name: "リンゴ",
  color: "red"}}
}
};

特定の型を除去・抽出

Exclude<T,U>
共用型のT型からU型を除外して新しい型を生成します。

type TypeD = string | number | boolean;

type TypeE = Exclude<TypeD, string>; //number | boolean
type TypeF = Exclude<TypeE, number>; //boolean

Extract<T,U>
T, U共通の型を引き抜き新しい型を生成します。

type TypeG = Extract<TypeD, number | boolean>; //number | boolean

NonNullable<T>
undefinedとnullを除外した型を生成します。

type TypeH = string | undefined;
type TypeI = NonNullable<TypeH>; //string

定義したものを必ず入れるように強制

Required<T>
Tで指定したインターフェースのプロパティの型を必須にします。
以下はcolorプロパティを省いたらエラーがでます。

interface Fruit {
  name?:string;
  color?: string;
}

let lemon: Required<Fruit> = {
  name: "レモン",
}; // エラー

----------------------------------------------------

今回はインターフェースを応用した型チェックについて紹介しました。

TypeScriptの解説は以上になります。
良かったらこれまでのTypeScriptを復習してみてください。

今回もご精読ありがとうございました。

よろしければサポートお願いします! サポートは、サービスの開発・改良や、記事を書く際の素材費とさせていただきます。 少しでも有益な情報発信をしていけるよう努めてまいります。 是非とも応援よろしくお願いします!!!🙇‍♂️