インターフェース
インターフェース(Interfaces)
インターフェースは、JavaScriptランタイム上では、何の影響もありません。TypeScriptのインターフェースは、オブジェクトの構造を宣言するための多くの機能があります。
次の2つは同じ意味の宣言です。１つ目は、インラインの型定義を使用し、2つ目はインターフェースを使用しています。
1
// Sample A
2
declare var myPoint: { x: number; y: number; };
3
4
// Sample B
5
interface Point {
6
x: number; y: number;
7
}
8
declare var myPoint: Point;
Copied!
しかし、サンプル Bの美しいところは、
myPoint このライブラリを使って、別のライブラリを作る誰かが、新しいプロパティを追加する際に、簡単にmyPointの宣言を拡張して、新しいプロパティを追加できることです：1
// Lib a.d.ts
2
interface Point {
3
x: number; y: number;
4
}
5
declare var myPoint: Point;
6
7
// Lib b.d.ts
8
interface Point {
9
z: number;
10
}
11
12
// Your code
13
var myPoint.z; // Allowed!
Copied!
これは、TypeScriptのインターフェースが拡張に対してオープンであるためです。これはTypeScriptの重要な教えです。インターフェースは、JavaScriptの拡張性と同じことを実現しています。
クラスはインターフェースを実装できる
誰かがあなたのために
interfaceで宣言したオブジェクト構造に従わなければならないクラスを使いたい場合、互換性を保証するためにimplementsキーワードを使うことができます：1
interface Point {
2
x: number; y: number;
3
}
4
5
class MyPoint implements Point {
6
x: number; y: number; // Same as Point
7
}
Copied!
基本的に
implementsしたクラスがあるときに、その外部のPointインターフェースを変更すると、あなたのコードベースでコンパイルエラーになりますので、簡単に同期を取ることができます：1
interface Point {
2
x: number; y: number;
3
z: number; // New member
4
}
5
6
class MyPoint implements Point { // ERROR : missing member `z`
7
x: number; y: number;
8
}
Copied!
implementsはクラスのインスタンスの構造を制限することに注意してください。1
var foo: Point = new MyPoint();
Copied!
foo：Point = MyPointのようなものは上記とは異なります。ヒント
すべてのインターフェースが簡単に実装できるとは限りません
インターフェースは、JavaScriptで可能などんな変な構造でも宣言できるように設計されています。
newをコールできる何かのインターフェースを考えてみましょう：1
interface Crazy {
2
new (): {
3
hello: number
4
};
5
}
Copied!
基本的な実装は次のようなものです：
1
class CrazyClass implements Crazy {
2
constructor() {
3
return { hello: 123 };
4
}
5
}
6
// Because
7
const crazy = new CrazyClass(); // crazy would be {hello:123}
Copied!
インターフェースを使って変な構造を宣言し、TypeScriptの型のサポートを得つつ、安全に使用することもできます。しかし、それらをTypeScriptのクラスとして実装できるとは限りません。
最終更新 1yr ago