インタビューの質問-TS (3): TypeScript のインターフェイスとは何ですか? 彼らは何をしますか?

インタビューの質問-TS(3): TypeScript のインターフェイスとは何ですか? 彼らは何をしますか?

TypeScript では、インターフェイスはオブジェクトのプロパティと動作を定義するためのツールです。これらはコード間の契約として機能し、オブジェクトが持つべきプロパティとメソッドを記述します。インターフェイスを使用することで、より優れた型チェック、モジュール性、コードの再利用を実現できます。

1. インターフェースの定義と使用

TypeScript では、キーワードを使用してinterfaceインターフェイスを定義します。簡単なインターフェイス定義の例を次に示します。

interface Person {
    
    
  name: string;
  age: number;
  greet(): void;
}

上の例では、オブジェクトにと のプロパティがPerson必要で、 というメソッドを持つ というインターフェイスを定義しましたnameagegreet

インターフェイスを使用してオブジェクトの形状を定義でき、そのインターフェイスを型アノテーションとして使用して、作成するオブジェクトがその形状に準拠していることを確認できます。例えば:

let person: Person = {
    
    
  name: "John",
  age: 25,
  greet() {
    
    
    console.log(`Hello, my name is ${
      
      this.name}. I'm ${
      
      this.age} years old.`);
  }
};

person.greet();  // 输出:Hello, my name is John. I'm 25 years old.

インターフェイスを使用すると、オブジェクトの構造と動作を明示的に指定できるため、コードの理解と保守が容易になります。オブジェクトがインターフェイスで定義された形状に準拠していない場合、TypeScript コンパイラは型エラーの警告を発行します。

2. オプションの読み取り専用属性

インターフェイス内のプロパティはオプションにすることができます。つまり、オブジェクト内に存在することも、存在しないこともできます。プロパティ名の後に疑問符 (?) を追加することで、オプションのプロパティを定義できます。例えば:

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

上記の例では、ageプロパティはオプションです。つまり、オブジェクトに存在する場合もあれば、存在しない場合もあります。

さらに、インターフェイス内のプロパティは読み取り専用にすることができます。つまり、オブジェクトの作成後にその値を変更することはできません。プロパティ名の前にキーワードを付けることで、readonly読み取り専用プロパティを定義できます。例えば:

interface Point {
    
    
  readonly x: number;
  readonly y: number;
}

上記の例では、xと のyプロパティは読み取り専用であり、オブジェクトの作成後にその値を変更することはできません。

3. インターフェースの継承

TypeScript では、インターフェイスは他のインターフェイスから継承することでその定義を拡張できます。キーワード を使用するとextends、別のインターフェースを継承するインターフェースを作成できます。これにより、インターフェース内で他のインターフェースの定義を再利用したり、構成したりすることができます。例えば:

interface Shape {
    
    
  calculateArea(): number;
}

interface Rectangle extends Shape {
    
    
  width: number;
  height: number;
}

上記の例では、インターフェイスはインターフェイスRectangleから継承し、プロパティを必要としメソッドを実装します。ShapewidthheightcalculateArea

インターフェイスの継承を通じて、より具体的で複雑なインターフェイスを作成し、コードの再利用性とモジュール性を向上させることができます。

4. インターフェースの実装とポリモーフィズム

TypeScript では、インターフェイスを使用してオブジェクトの形状を記述するだけでなく、クラスの実装を制約することもできます。クラスがインターフェイスを実装する場合、クラスはインターフェイスによって定義されたすべての要件を満たしている必要があります。

たとえば、インターフェイスを定義しますAnimal

interface Animal {
    
    
  makeSound(): void;
}

Animal次に、インターフェイスを実装するクラスを作成できますDog

class Dog implements Animal {
    
    
  makeSound() {
    
    
    console.log("Woof!");
  }
}

Animalインターフェイスを実装する場合、DogクラスはmakeSoundメソッドを実装する必要があります。このようにして、ポリモーフィズムを使用して、同じインターフェイスを実装するオブジェクトのグループを処理できます。例えば:

function performSound(animal: Animal) {
    
    
  animal.makeSound();
}

let dog = new Dog();
performSound(dog);  // 输出:Woof!

インターフェイスの実装とポリモーフィズムを通じて、より柔軟で拡張可能なコードを作成できます。

要約する

TypeScript では、インターフェイスはオブジェクトの形状と動作を定義するための強力なツールです。インターフェイスを使用すると、より優れた型チェック、モジュール化、コードの再利用が可能になります。インターフェイスでは、オブジェクトのプロパティとメソッドを定義したり、オプションの読み取り専用プロパティを含めたり、継承と実装を通じてインターフェイスとクラスの間により複雑な関係を作成したりできます。

開発プロセスでは、インターフェイスを合理的に使用すると、より信頼性が高く、保守しやすく、拡張可能なコードを作成するのに役立ちます。コード間の規約を明確に定義することで、コードをより適切に整理および管理し、潜在的なバグを減らすことができます。TypeScript のインターフェイスの利点を最大限に活用して、開発効率とコード品質を向上させましょう。

おすすめ

転載: blog.csdn.net/weixin_42560424/article/details/131912762