TypeScript での型の拡張

たとえば、以下のように、Personという型を定義することができます。

interface Person {
  name: string;
  age: number;
}

この型は、nameとageのプロパティを持つオブジェクトを表します。

その後、この型を拡張して、Studentという新しい型を作成することができます。

interface Student extends Person {
  studentId: string;
  grade: number;
}

この型は、Person型のすべてのプロパティに加えて、studentIdとgradeのプロパティを持つオブジェクトを表します。

TypeScript での型の拡張: 例

基本的な拡張

interface Person {
  name: string;
  age: number;
}

interface Student extends Person {
  studentId: string;
  grade: number;
}

const student: Student = {
  name: "John Doe",
  age: 20,
  studentId: "12345",
  grade: 3
};

• student変数
  Student型のオブジェクトを作成し、すべてのプロパティに値を割り当てます。
• Studentインターフェース
  Personインターフェースを継承し、studentIdとgradeのプロパティを追加します。
• Personインターフェース
  nameとageのプロパティを持つ基本的な人の情報を表します。

インターフェースの多重継承

interface Teacher {
  subject: string;
}

interface StudentTeacher extends Student, Teacher {
  experience: number;
}

const studentTeacher: StudentTeacher = {
  name: "Jane Smith",
  age: 30,
  studentId: "67890",
  grade: 4,
  subject: "Math",
  experience: 5
};

• StudentTeacherインターフェース
  StudentとTeacherインターフェースを継承し、experienceプロパティを追加します。
• Teacherインターフェース
  教師の情報を表します。

型の拡張とジェネリック

interface Animal {
  name: string;
}

interface Dog extends Animal {
  breed: string;
}

interface Cat extends Animal {
  color: string;
}

function printAnimal<T extends Animal>(animal: T) {
  console.log(animal.name);
}

const dog: Dog = { name: "Buddy", breed: "Golden Retriever" };
const cat: Cat = { name: "Whiskers", color: "Black" };

printAnimal(dog); // Output: Buddy
printAnimal(cat); // Output: Whiskers

• 関数呼び出し
  printAnimal関数にDog型とCat型のオブジェクトを渡すことができます。
• 型引数
  Tは、Animalを継承する型を表します。
• ジェネリック関数
  printAnimal関数は、Animalを継承する任意の型を受け取ることができます。

ミックスイン

ミックスインは、複数のオブジェクトのプロパティを組み合わせる方法です。TypeScriptでは、ミックスインをシミュレートするために、インターフェースを組み合わせることができます。

interface MixinA {
  propertyA: string;
}

interface MixinB {
  propertyB: number;
}

interface TargetClass extends MixinA, MixinB {
  propertyC: boolean;
}

const target: TargetClass = {
  propertyA: "valueA",
  propertyB: 123,
  propertyC: true
};

ユーティリティ型

ユーティリティ型は、既存の型を操作して新しい型を作成するための便利な型です。TypeScriptには、多くの組み込みユーティリティ型が提供されています。

interface Person {
  name: string;
  age: number;
}

type ReadonlyPerson = Readonly<Person>; // Person型のプロパティをすべて読み取り専用にする

const readonlyPerson: ReadonlyPerson = {
  name: "John Doe",
  age: 20
};

// readonlyPerson.name = "Jane Smith"; // エラー: Readonly<Person>型のプロパティは読み取り専用です

条件付き型

条件付き型は、型の条件に基づいて異なる型を返す型です。

type Nullable<T> = T | null;

type MaybeUser = Nullable<User>;

const maybeUser: MaybeUser = null;

マッピング型

マッピング型は、既存の型のプロパティを新しい型に変換するための型です。

interface Person {
  name: string;
  age: number;
}

type ReadonlyPerson2 = {
  [P in keyof Person]: Readonly<Person[P]>;
};

const readonlyPerson2: ReadonlyPerson2 = {
  name: "John Doe",
  age: 20
};