现如今,TS正在逐渐成为前端OO编程的不二之选,以下是我在学习过程中对抽象类和接口做的横向对比。

1. 抽象类当做父类,被继承。且抽象类的派生类的构造函数中必须调用super();接口可以当做“子类”继承其他类

抽象类派生:

abstract class Human {
constructor (readonly name:string) {} } class Student extends Human {
constructor (name:string) {
super(name)
}
}

接口继承类:

class Man {
job: string;
constructor (readonly name: string) {}
earnMoney () {
console.log(`earning money`)
}
} interface HumanRule extends Man{
nose: string;
mouth: string;
ear: string;
eye: string;
eyebrow: string
}

当类被接口继承时,通常是需要为这个类的子类添加约束。例如下面的例子中,Man类的子类就需要去实现特定的五官属性,否则将会报错。

class Player extends Man implements HumanRule{
nose: string;
mouth: string;
ear: string;
eye: string;
eyebrow: string
constructor (name) {
super(name);
}
}

2. 抽象类与接口都无法实例化, 类类型接口实际上是一种 抽象类型

按个人理解,在使用类类型的接口时,类类型的接口其实就相当于抽象类的子集。抽象类中除了可以像接口那样只定义不实现外,还可以部分实现,而且也可以使用类型修饰符。

类类型的接口更多的是当做一种抽象的数据类型使用,此处所说的类型通常是某个类的实例类型。

let James: Player = new Player('james');  // 类类型使用

class SoccerPlayer extends Player {
constructor (name) {
super(name)
} playSoccer () {
console.log(`${this.name} is playing soccer.`)
}
} function createPlayer (pl: SoccerPlayer, name: string) { // 类类型调用
return new SoccerPlayer(name);
}

3. 接口中不能包含具体实现,抽象类中除抽象函数之外,其他函数可以包含具体实现

此处我们将Human类增加一些内容:

abstract class Human {
constructor (readonly name:string) {}
protected thinking () {
console.log(`I am a human, so i can think, ${this.name} is thinking.`)
}
}

作为人类,可以在人类 这个类中添加具体实现,因为人类都可以思考。所以思考这个类就不必非要放到子类中去具体实现,这也正是抽象类的灵活之处。

4. 抽象类中的抽象方法在子类中必须实现, 接口中的非可选项在接口被调用时必须实现。

此处我们继续增加Human类的内容,增加move的具体实现方法为抽象方法,因为不同类型的人,移动的实现不同。(此处实际上也是OO的特性中,多态的一种具体实现)

abstract class Human {
constructor (readonly name:string) {}
protected thinking () {
console.log(`I am a human, so i can think, ${this.name} is thinking.`)
}
abstract move (): void
} class Student extends Human {
constructor (name:string) {
super(name)
} move () {
console.log(`I am a student, so i move by bus`)
}
}

而接口一旦调用,就必须要严格实现。此处以函数类型的接口为例:

interface createPlayer {
(pl: SoccerPlayer, name:string): SoccerPlayer
} let createPlayer:createPlayer = function (pl: SoccerPlayer, name: string) { // 修改createPlayer 使用匿名函数方法创建
return new SoccerPlayer(name);
}

5. 抽象方法可当做类的实例方法,添加访问修饰符;但是接口不可以

抽象方法的添加访问修饰符和接口的严格实现其实都是各自的特点,我们也往往是根据这些特点去选择究竟是使用抽象类还是使用接口。

还拿Human类来说:

abstract class Human {
constructor (readonly name:string) {}
protected thinking () {
console.log(`I am a human, so i can think, ${this.name} is thinking.`)
}
protected abstract move (): void
}

我们为move方法添加abstract标识符,是想让开发者非常明白,Human的派生类中必须要实现此方法;而使用protected标识符,是想限制move方法调用或重载的权限。

综合来说抽象类更多的是实现业务上的严谨性;接口更多的是制定各种规范,而此规范又分为很多类规范,就像官方文档在介绍接口这一节的时候所说的,例如函数型规范、类类型规范、混合规范、索引规范等。

Typescript中抽象类与接口详细对比与应用场景介绍的更多相关文章

  1. “全栈2019”Java第六十六章:抽象类与接口详细对比

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...

  2. 转:二十一、详细解析Java中抽象类和接口的区别

    转:二十一.详细解析Java中抽象类和接口的区别 http://blog.csdn.net/liujun13579/article/details/7737670 在Java语言中, abstract ...

  3. C#中抽象类和接口的区别

    原文:C#中抽象类和接口的区别 大家在编程时都容易把抽象类和接口搞混,下面为大家从概念上讲解抽象类和接口的区别: 一.抽象类: 含有abstract修饰符的class即为抽象类,抽象类是特殊的类,只是 ...

  4. 关于JAVA中抽象类和接口的区别辨析

    今天主要整理一下新学习的有关于Java中抽象类和接口的相关知识和个人理解. 1 抽象类 用来描述事物的一般状态和行为,然后在其子类中去实现这些状态和行为.也就是说,抽象类中的方法,需要在子类中进行重写 ...

  5. java 8中抽象类与接口的异同

    1.java 8中抽象类与接口的异同 相同点: 1)都是抽象类型: 2)都可以有实现方法(以前接口不行): 3)都可以不需要实现类或者继承者去实现所有方法,(以前不行,现在接口中默认方法不需要实现者实 ...

  6. 谈谈php中抽象类和接口的区别

    php中抽象类和接口的区别 1) 概念 面向对象的三大概念:封装,继承,多态 把属性和方法封装起来就是类.        一个类的属性和方法被另外的类复制就是继承,PHP里面的任何类都可以被继承,被继 ...

  7. PHP中抽象类与接口的区别

    PHP中抽象类与接口的区别 抽象类abstract 概念 定义为抽象的类不能被实例化.任何一个类,如果有一个方法是被声明为抽象的,那么这个类就必须被声明为抽象的类. 继承一个抽象类的时候,子类必须定义 ...

  8. 转载:详细解析Java中抽象类和接口的区别

    在Java语言中, abstract class 和interface 是支持抽象类定义的两种机制.正是由于这两种机制的存在,才赋予了Java强大的 面向对象能力.abstract class和int ...

  9. 详细解析Java中抽象类和接口的区别

    在Java语言中, abstract class 和interface 是支持抽象类定 义的两种机制.正是由于这两种机制的存在,才赋予了Java强大的 面向对象能力.abstract class和in ...

随机推荐

  1. flutter No material widget found textfield widgets require a material widget ancestor

    Error states that TextField widgets require a Material widget ancestor. Simply wrapping your whole l ...

  2. if __name__ == __'main'__: 判断讲解

    """王思聪作为消费者 要吃热狗生产者 负责做热狗问题:王思聪不清楚对方会生产多少热狗 """from multiprocessing im ...

  3. 常用的Eclipse 快捷键

    显示所有快捷方式 SHIFT + CTRL + L 代码类 ALT + / 代码补全 ALT + 1 批量修改变量名 SHIFT + CTRL + F 自动格式代码4 SHIFT + ALT + R ...

  4. application program Can't Start

    一.电脑插U盘中毒之后感染,出现无法启动,但是风扇工作,先拔掉电源,卸掉电池之后重新安装,重启电脑,之后发现电脑桌面上的程序无法启动,360webShield也无法启动,可能是电脑中毒后的假死机现象. ...

  5. C语言将字符串转json

    示例代码: #include <stdio.h> #include <string.h> #include <stdlib.h> char *strrpc(char ...

  6. python 读取指定div的内容

    # -*- coding:utf-8 -*- from bs4 import BeautifulSoup import urllib.request import re # 如果是网址,可以用这个办法 ...

  7. 微信小程序 如何获取用户code

    1.首先需要获取code 使用 wx.login({ success: function(res) { console.log(res);//这里的返回值里面便包含code }, fail: func ...

  8. centos/redhat破解账号密码

    说明:1.个人觉得centos系统和redhat系统差不多,界面都差不多一样. 2.下面方法用于开机root密码忘了,其他人篡改root密码等等 下面是破解账号密码(图解) 之后要等久点 效果: 方法 ...

  9. Java+selenium之WebDriver常见特殊情况如iframe/弹窗处理(四)

    1. iframe 的处理 查找元素必须在对应的 ifarme 中查找,否则是找不到的 // 传入参数为 frame 的序号,从0开始 driver.switchTo().frame(Int inde ...

  10. vue自定义指令directives使用及生命周期

    生命周期 bind:只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个绑定时执行一次的初始化动作. inserted:被绑定元素插入父节点时调用(父节点存在即可调用,不必存在于docu ...