如何在TypeScript中从类扩展接口

如何在TypeScript中从类扩展接口

在本文中,我们将尝试通过一些编码示例来理解如何在TypeScript中扩展接口从类中扩展接口。首先,让我们快速了解如何使用以下所述的语法在TypeScript中创建类和接口:

语法:

这是创建类的语法。我们可以使用以下语法在TypeScript中创建类:

class class_name {
    ...
}

这是创建接口的语法。我们可以使用以下语法在TypeScript中创建接口:

interface interface_name {
    ...
}

现在我们已经了解了创建类和接口的基本语法,让我们通过以下编码示例来了解这些语法以及如何从类中扩展接口的主要目标:

示例1:

  • 在此示例中,将定义一个类,其中将定义一些变量。
  • 然后将构建一个扩展上述类的接口,在该接口中将定义一个方法,但其定义将在稍后的某个不同的类中定义。
  • 然后将创建另一个类,负责扩展父类和所定义的接口。
  • 然后,对于此派生类,将实例化一个对象,并将其进一步用于打印在方法中定义的结果,该方法在接口中声明,但在接口本身中提供了其定义。
// 创建父类
class Person {
    public name: string;
}

// 由上述类扩展的接口
interface Details extends Person{
    details(): void;
}

// 将上述接口和类一起使用
class Person_Details extends Person implements Details {
    details(): void {
        this.name = "GeeksforGeeks";
        console.log(this.name);
    }
}

let object = new Person_Details();
object.details();

输出:

GeeksforGeeks

示例2:

  • 在此示例中,创建了一个被推断为父类的类,其中包含不同的变量声明。
  • 然后,将定义两个接口(或多个接口),每个接口都包含各自的方法声明,其定义将在单独的类中(被推断为派生类)中定义。
  • 然后创建一个派生类,该派生类负责扩展父类以及定义的接口。
  • 然后最后实例化一个对象,该对象负责调用在派生类中定义的所有方法,这些方法最终将包含结果。
// 父类声明
class Student {
    public id: number;
    public name: string;
}
  
// 创建多个继承上述类的接口
interface Student_1 extends Student {
    student1_details(): void;
}
  
interface Student_2 extends Student {
    student2_details(): void;
}
  
// 创建一个继承上述接口的类 
class Student_Details extends Student implements Student_1, Student_2 {
    student1_details(): void {
        this.name = "Apple";
        this.id = 1;
        console.log(this.id + " - " + this.name);
    }
  
    student2_details(): void {
        this.name = "Banana";
        this.id = 2;
        console.log(this.id + " - " + this.name);
    }
}
  
let student_object = new Student_Details();
student_object.student1_details();
student_object.student2_details();

输出:

1 - Apple
2 - Banana

阅读更多:JavaScript 教程

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程