TypeScript：interface接口

作者：马育民 • • 阅读：10066

概述

interface，即：接口

学过 Java 的小伙伴，可以将其理解成 类似 Java 中的 接口，但 有些不同

interface接口，是对象的模板，即：将一类对象的 共同方法、共同属性，放到接口中

接口中，可以 有属性（这里与Java中的接口不同）

接口中 所有方法 都 没有方法体

接口 不能被实例化，接口 没有构造方法

很好的体现了面向对象的编程思想

作用

interface 接口主要用于定义对象与类的结构（包含属性、方法），作用是制定数据与类的规范标准；它仅在 TypeScript 编译阶段执行静态类型检查，编译转换为 JavaScript 后会被全部移除，不会生成任何运行时代码。

类比

早年手机，不同手机厂商的手机，充电口互不通用，导致十分混乱

interface 接口 相当于 USB接口，通过制定 USB接口 规范（如：宽高、功率属性），功能（如：充电方法、传输数据方法）

其他厂家按照该 规范、功能，生产制造USB接口，符合USB接口的设备，都可以 充电 、 传输数据，达到 通用 的目的

定义

与定义类方式相似，但使用 interface 关键字。它也会被编译成 .class 文件，但不是类，而是另外一种引用数据类型

interface 接口名称 { 
 // 方法声明
}

声明属性、方法

interface USB {
    power:number // 功率
    chongdian():void //充电速度
}

接口的实现对象

可直接定义对象，并让对象实现该接口，此时必须 实现 属性、方法，并且必须符合规定的类型。

正确写法

const iphone:USB = {
    power:5, // 功率 5w
    chongdian: ():void =>{
        console.log("普通充电速度")
    }
}

访问属性、调用方法：

console.log("iPhone充电功率：",iphone.power)
iphone.chongdian()

错误写法

对象中没有定义 power 属性，如下：

const iphone:USB = {
    chongdian: ():void =>{
        console.log("普通充电速度")
    }
}

执行编译：

tsc 接口.ts

报错如下：

const iphone:USB = {
        ~~~~~~

  接口.ts:2:2
    2  power:number // 功率
       ~~~~~
    'power' is declared here.


Found 1 error in 接口.ts:6

接口的实现类

类与接口的关系为 实现 关系，即：类实现接口，该类称为接口的实现类。

实现的动作类似继承，格式相仿，只是关键字不同，实现使用 implements 关键字。

注意：普通类实现接口，必须实现接口中所有方法

例子

定义实现类:

class Android implements USB {
    power=100 // 功率 100 w
    chongdian() : void {
        console.log("快充")
    }
}

测试，访问属性、调用方法：

const huawei=new Android()

console.log("充电功率：",huawei.power)

//由于android类实现了USB接口，那么就一定可以调用chongdian() 方法
huawei.chongdian()

实现多个接口

一个类是可以实现 多个接口，实现格式:

class 类名 [extends 父类名] implements 接口名1,接口名2,接口名3... { 
// 重写接口中抽象方法
}

例子

定义 耳机 接口:

interface Erji {
    bofang():void
}

定义实现类，实现多个接口：

class Android implements USB,Erji {
    chongdian():void {
        console.log("充电")
    }

    bofang():void {
        console.log("播放声音")
    }
}

测试类：

const huawei=new Android();
//由于实现了Erji接口，那么就可以调用 bofang()
huawei.bofang();

抽象方法

实现 多个接口，实现类必须重写所有抽象方法。如果抽象方法有重名的，只需要重写一次。

接口的继承

一个接口可以继承（extends）另一个接口

//当子接口继承父接口，也就拥有了父接口的方法
interface TYPEC extends USB {
    kuaiSuChongDian():void
}

class Huawei implements TYPEC{
    kuaiSuChongDian():void {
        console.log("快速充电");
    }


    chongdian():void {
        console.log("充电");
    }
}

测试类：

const huawei=new Huawei();
huawei.kuaiSuChongDian();

特点

  • 接口中，没有构造方法，不能创建对象

原文出处：/show_1IX5MbxRgC4K.html

吉ICP备15003043号