クラスでinterfaceを実装する方法【TypeScript】

クラスでinterfaceを実装する方法を学んだのでアウトプットしたいと思います。

interfaceを実装する

クラスでinterfaceを実装するとは

クラスでinterfaceを実装するとは、interfaceを使用してクラスを実装するということです。

前回の記事で触れたように、interfaceは型として使用することができます。つまり、クラスでinterfaceを実装するというのは、型に沿ったクラスを実装するということです。

また、違うクラス同士で同じ機能を持たせたいとき、interfaceを実装すると便利です。

interfaceについて不安がある方はこちらの記事をご覧ください。

【TypeScript】インターフェースの基本

TypeScriptのインターフェースについて、基本的なことを学んだのでアウトプットします。インターフェースとはTypeScriptのインターフェースはクラスなどに対して、その機能を強制するために使われます。いわゆる実装のない型を定義してい...

kiseru-note.com

2023.08.03

書き方

実装は次のように記述します。implementsは「実装する」という意味です。

class クラス名 implements interface名{ };

複数のinterfaceを実装したい場合、「interface名 , interface名」と繋げば複数のinterfaceを実装できます。

クラスでinterfaceを実装するサンプル

次にクラスでinterfaceを実装するサンプルです。

HumanクラスとBirdクラスはCreatureインターフェースを実装しています。HumanクラスもBirdクラスもCreatureインターフェースを実装しているため、Creatureインターフェースのプロパティを持タネければなりません。

interface Creature {
  sort: string;
  breathe();
} 

class Human implements Creature {
  think: string;
  sort: string;
  constructor(s: string) {
    this.sort = s;
  }
  breathe() {
    console.log(this.sort + "は息をする");
  }
}

class Bird implements Creature {
  fly: string;
  sort: string;
  constructor(s: string) {
    this.sort = s;
  }
  breathe() {
    console.log(this.sort + "は息をする");
  }
}

let a: Human = new Human("たかし");
a.breathe(); //たかしは息をする

let b: Bird = new Bird("すずめ");
b.breathe(); //すずめは息をする

このようにinterfaceを実装できれば、違うクラス同士で同じ機能を持たせたいときに使用することができます。

まとめ

今回はinterfaceを実装方法についてアウトプットさせていただきました。実戦での経験を積んで記事をアップグレードしていきたいと思います。