TypeScriptでインターフェースとクラスを使いこなして、生産性を向上させる
TypeScriptでインターフェースとクラスを使い分ける
インターフェースは、オブジェクトの構造を定義するための型です。具体的には、オブジェクトが持つべきプロパティと、それぞれのプロパティの型を定義します。インターフェース自体はオブジェクトを作成することはできませんが、他のオブジェクトやクラスの型として使用することができます。
クラスは、オブジェクトの構造と動作を定義するための型です。インターフェースと同様に、クラスもプロパティとメソッドを定義することができます。さらに、コンストラクタやアクセサメソッドなどの機能も利用できます。
使い分け
インターフェースとクラスを使い分けるには、それぞれの役割を理解することが重要です。
- インターフェース: オブジェクトの構造を定義する
- クラス: オブジェクトの構造と動作を定義する
以下は、インターフェースとクラスを使い分ける具体的な例です。
インターフェースを使用する例
- オブジェクトの構造を共有したい場合
- オブジェクトの型チェックを行いたい場合
- 異なるクラス間で共通のインターフェースを定義したい場合
インターフェースとクラスは、それぞれ異なる役割を持つため、状況に応じて使い分けることが重要です。インターフェースはオブジェクトの構造を定義し、クラスはオブジェクトの構造と動作を定義します。
インターフェースの例
interface Person {
name: string;
age: number;
}
const person: Person = {
name: "John Doe",
age: 30,
};
console.log(person.name); // "John Doe"
console.log(person.age); // 30
クラスの例
class Person {
private name: string;
private age: number;
constructor(name: string, age: number) {
this.name = name;
this.age = age;
}
public getName(): string {
return this.name;
}
public getAge(): number {
return this.age;
}
}
const person = new Person("John Doe", 30);
console.log(person.getName()); // "John Doe"
console.log(person.getAge()); // 30
この例では、Person というクラスを定義し、name と age という 2 つのプロパティを持つことを指定しています。また、コンストラクタと getName() と getAge() という 2 つのメソッドも定義しています。
上記のサンプルコードは、インターフェースとクラスの使い分けを理解するのに役立ちます。
インターフェースとクラスを使い分ける他の方法
継承
クラスは、他のクラスから継承することができます。継承を使用することで、コードの再利用性を高めることができます。
class Animal {
public name: string;
constructor(name: string) {
this.name = name;
}
}
class Dog extends Animal {
public bark(): void {
console.log("Woof!");
}
}
const dog = new Dog("Fido");
console.log(dog.name); // "Fido"
dog.bark(); // "Woof!"
この例では、Animal というクラスと Dog というクラスを定義しています。Dog クラスは Animal クラスから継承し、name プロパティと bark() メソッドを持っています。
ジェネリック
インターフェースとクラスは、ジェネリック型を使用することができます。ジェネリック型を使用することで、コードをより汎用的にすることができます。
interface Person<T> {
name: string;
age: number;
data: T;
}
const person1: Person<string> = {
name: "John Doe",
age: 30,
data: "This is a string.",
};
const person2: Person<number> = {
name: "Jane Doe",
age: 31,
data: 12345,
};
console.log(person1.name); // "John Doe"
console.log(person1.data); // "This is a string."
console.log(person2.name); // "Jane Doe"
console.log(person2.data); // 12345
この例では、Person というジェネリックインターフェースを定義し、T という型パラメータを持っています。Person インターフェースは、name と age という 2 つのプロパティと、T 型の data プロパティを持っています。
型エイリアスを使用して、インターフェースやクラスの型を短縮することができます。
type Person = {
name: string;
age: number;
};
const person: Person = {
name: "John Doe",
age: 30,
};
console.log(person.name); // "John Doe"
console.log(person.age); // 30
この例では、Person という型エイリアスを定義し、name と age という 2 つのプロパティを持つオブジェクトの型を表しています。
インターフェースとクラスを使い分ける方法はいくつかあります。状況に応じて最適な方法を選択することが重要です。
typescript class interface
