TypeScript の implements キーワード

1. TypeScript タイプチェック
2. TypeScript インターフェイス
3. TypeScript の implements 句

この記事では、TypeScript の implements キーワードについて説明します。

TypeScript タイプチェック

TypeScript は JavaScript のスーパーセットであり、コンパイル時の型チェックが含まれています。コンパイル時の型チェックは、主に変数または引数の値が想定されている形をしているかどうかに焦点を当てています。

この手法は、TypeScript ではダックタイピングと呼ばれます。ダックタイピングの結果として、TypeScript コンパイラは 2つのオブジェクトが同一であるかどうかをチェックします。

TypeScript プログラムの型安全性を保証します。

タイプチェックは、指定された 2つのオブジェクトに同じプロパティとメソッドが含まれているかどうかをチェックします。そうでない場合、TypeScript コンパイラはエラーをスローします。

次のように、3つの TypeScript クラスがあると仮定します。

class Person {
    gender: string;
}

class Employee {
    gender: string;
    empId: string;
}

class Manager {
    gender: string;
    empId: string;
}

新しい Person オブジェクトと Employee オブジェクトを作成しましょう。

let person1: Person = new Person();
let employee1: Employee = new Employee();

このコードは、型チェック規則に違反していないため、正常にコンパイルされます。

employee1 オブジェクトを Person 型変数に割り当ててみましょう。

let person2: Person = employee1;

employee1 オブジェクトが Person オブジェクトの形をしているため、正常にコンパイルされました。Person オブジェクトには gender というプロパティが 1つしかないため、employee1 オブジェクトに準拠しています。

追加の empId プロパティはまったく問題ありません。

次のように、person1 オブジェクトを Employee 型変数に割り当ててみましょう。

let employee2: Employee = person1;

TypeScript ダックタイピングルールはこれを許可していません。したがって、TypeScript コンパイラはエラーを発生させます。

通常、TypeScript インターフェイスは、TypeScript コードでタイプとコントラクトを定義する役割を果たします。

TypeScript インターフェイス

TypeScript インターフェースは、クラスの形を提供します。TypeScript クラスがインターフェイスから派生する場合は常に、インターフェイスによって定義された構造を実装する必要があります。

それは実際の契約のようなものです。クラスがインターフェースを受け入れる限り、それはインターフェース構造に準拠する必要があります。インターフェイスはビジネスロジックを実装していません。

以下に示すように、プロパティとメソッドを宣言するだけです。

interface IVehicle {
    vehicleNumber: string;
    vehicleBrand: string;
    vehicleCapacity: number;
    getTheCurrentGear: () => number;
    getFuelLevel(): string;
}

TypeScript インターフェイスは、型、関数型、配列型などとして使用できます。次のセクションで説明するように、クラスのコントラクトとして使用できます。

TypeScript の implements 句

TypeScript の implements キーワードは、クラス内にインターフェイスを実装するために使用されます。IVehicle インターフェースには、実装レベルの詳細は含まれていません。

したがって、IVehicle インターフェイスは、新しい VipVehicle クラスによって実装できます。

class VipVehicle implements IVehicle {

}

上記の例に示すように、VipVehicle クラスは IVehicle インターフェイスとコントラクトします。この TypeScript コードをコンパイルすると、次のようにエラーが発生します。

TypeScript コンパイラは、VipVehicle クラス内に 3つのプロパティと 2つのメソッドが実装されていないと文句を言います。したがって、IVehicle インターフェースの構造に準拠することが必須です。

3つのプロパティを追加し、それに応じて 2つのメソッドを実装する必要があります。

class VipVehicle implements IVehicle {
    vehicleNumber: string;
    vehicleBrand: string;
    vehicleCapacity: number;

    getTheCurrentGear():number {
        return 3; // dummy numebr returning here for demo purposes
    }

    getFuelLevel():string {
        return 'full'; // dummy string returning here for demo purposes
    }

}

コードを再度コンパイルすると、正常にコンパイルされるはずです。