写点什么

给前端介绍对象啦!(TypeScript 版)(三)

  • 2020-01-07
  • 本文字数:1916 字

    阅读完需:约 6 分钟

给前端介绍对象啦!(TypeScript版)(三)

多态:我就是我,不一样的烟火

多态是指同一个方法在子类中具有不同表现形式。例如:Dog 类和 Cat 类都有 eat ()/say ()方法,尽管都是来自 Animal 定义的 eat ()/say ()方法,但运行结果完全不同。


(温馨提示:左右滑动可查看全部代码)


class Cat extends Animal {       public eat() {//多态 扩展原方法               super.eat();               console.log("I like eating fish");       }       public say() {               console.log("Miao~");       }       public catchMouse() {               //...       }}
复制代码


测试用例:


let myCat: Animal = new Cat("XiaoHua", 3);       myCat.eat();//I am eating someting     I like eating fish       myCat.say();//Miao~
复制代码

接口

接口:没有规矩不成方圆


接口即规范,规定了某种能力必须要实现的方法。例如:Flyable 接口规定了具有飞行能力必须实现 fly()方法。Bird 和 Plane 类都实现了 Flyable 接口,具有飞行能力。


(温馨提示:左右滑动可查看全部代码)


interface Flyable {       fly();}interface catchBug {       catchBug();}class Bird extends Animal implements Flyable,catchBug {       public say() {               console.log("Ji~Ji~Zha~Zha~");       }       public fly() {               console.log("I am flying with flapping my wings");       }       public catchBug() {               //...       }}class Plane implements Flyable {       fly() {               console.log("I am flying with my engines");       }       takePeople() {               //...       }}
复制代码


测试用例:


(温馨提示:左右滑动可查看全部代码)


let flyable1: Flyable = new Bird("Polly", 1);       flyable1.fly(); //I am flying with flapping my wings       // flyable1.eat();//编译报错: 不存在eat()
let flyable2: Flyable = new Plane(); flyable2.fly();//I am flying with my engines
复制代码

抽象类与接口:有同有异

抽象类和接口很类似,都有未实现的方法,等待其他类去实现。区别是:抽象类可以有一些成员的实现,而接口没有成员的实现;一个类只能继承自一个抽象类,但可以实现多个接口。例如:Animal 类,有抽象方法 say(),也有已实现的方法;上面 Bird 类只能继承自一个类,但又同时实现了 flyable()/catchBug()两个接口。

OOP 设计原则

李氏替换原则:父债可以子来偿


所有引用基类的地方必须能透明的使用其子类的对象,因为子类的对象具有基类所有的属性和方法。(注:基类是指父类/父类的父类等)但反过来就不行了,有需要子类的地方,基类未必就能适应。例如:上面代码中,我们可以将 Dog 对象和 Cat 对象赋值给了 Animal 类型的变量。下面代码中,People 构造函数需要一个 Animal 类型的参数,我们传入了 Dog 类型的对象。


(温馨提示:左右滑动可查看全部代码)


class People extends Animal{       constructor(public name: string, public age: number,public pet: Animal) {               super(name,age);       };       public say(){               console.log(`My name is ${this.name}, I am ${this.age} years old, my pet's name is ${this.pet.name}`);       }}
复制代码


测试用例:


(温馨提示:左右滑动可查看全部代码)


let myBrother: People = new People("XiaoMing", 18, new Dog("GouDan", 2));      myBrother.say();//My name is XiaoMing, I am 12 years old, my pet's name is GouDan      console.log('totalNum='+Animal.totalNum);//totalNum=5 //Dog/Cat/Bird/Dog/People/
复制代码


依赖倒置原则:面向接口编程,大家都依赖接口


在无接口的代码组织中,是高层模块依赖低层模块。如果按照面向对象编程依赖倒置原则,高层模块和低层模块不互相依赖,他们都依赖于其接口/抽象类。例如:如果不存在接口,直接调用 Bird 类/Plane 类的 fly()方法,那么调用者便依赖于 Bird 类/Plane 类。在上面例子中采用了接口编程,调用者的调用依赖于 Flyable()接口;Bird 类和 Plane 类的实现都依赖于 Flyable()接口。


请看下图,原本高层模块向下依赖的箭头,变为低层模块向上依赖的箭头。这就是依赖倒置名称的由来。


无接口:



有接口,依赖倒置:


其他设计原则

单一职责、开闭原则、接口隔离、迪米特法则等其他 OOP 设计原则呢,后会有期。

总结

在一切皆对象的世界中,我们已经学习了面向对象三大特征——封装、继承、多态,和两条面向对象设计原则——李氏替换原则、依赖倒置原则。后面有机会再介绍其他 OOP 设计原则和 GoF 设计模式。


本转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/CXaasAzRMk3mD_waWv8DHQ


2020-01-07 15:39681

评论

发布
暂无评论
发现更多内容

山西省等保测评公司名单【2025】

行云管家

网络安全 等保 山西

【GreatSQL优化器-04】贪婪搜索算法浅析

GreatSQL

拼多多商品评价API的获取与应用

科普小能手

拼多多 API API 接口 拼多多商品详情接口 拼多多API

CST软件如何使用Poser人体摆姿势

思茂信息

cst cst使用教程 CST软件

淘宝API接口探索:图片搜索拍立淘与商品评论的深度挖掘

代码忍者

API 接口 pinduoduo API

探索 Go 语言中的内存对齐:为什么结构体大小会有所不同?

左诗右码

Go

如何理解ArkTS不支持structural typing

威哥爱编程

华为 HarmonyOS Open Harmony ArkTS HarmonyOS NEXT

SD-WAN技术如何优化TikTok直播网络?

Ogcloud

SD-WAN SD-WAN组网 SD-WAN服务商 tiktok直播 tiktok直播网络

携手上海证券,共同见证市场活跃背景下交易服务新趋势

非凸科技

上海证券 非凸科技

【等保小知识】信息系统怎么定义?等保测评多久一次?

行云管家

信息系统 等保 等保测评

DR Auto-Sync:TiDB 同城两中心自适应同步复制技术解析

TiDB 社区干货传送门

新版本/特性解读

TiDB v8.x Tiproxy组件

TiDB 社区干货传送门

8.x 实践

TiDB连接的探活功能探索

TiDB 社区干货传送门

TiDB 源码解读 6.x 实践 数据库连接

“老爷机”训不动Lora?一台云电脑就可以让你轻松炼丹

Finovy Cloud

LoRa 云电脑

【JIT/极态云】技术文档--钉钉自建组织

武汉万云网络科技有限公司

低代码

双 11 营销活动数量、转化率双提升,火山引擎数智平台为此都做了什么?

字节跳动数据平台

如何通过SD-WAN实现多云平台的高效互联?

Ogcloud

SD-WAN 多云管理 SD-WAN组网 多云互联 多云部署

YOLOP 多任务算法详解

地平线开发者

自动驾驶 算法

【线上发布会预约中】资源有限,性能无限:GreptimeDB Edge 赋能车端数据处理新高度

Greptime 格睿科技

数据库 汽车 性能报告

企业采购比价:品牌采购时借用淘宝商品详情接口来采购比价

tbapi

淘宝商品详情接口

【JIT/极态云】技术文档--标准组织

武汉万云网络科技有限公司

低代码

⭐️ GitHub Star 数量前十的工作流项目

NocoBase

GitHub 开源 工作流 工作流引擎 工作流自动化

荣誉再加码!天翼云揽获SD-WAN & SASE大会两项大奖!

科技热闻

如何设置自动化测试断言?

老张

软件测试 自动化测试 接口测试 质量保障

TiDB基于硬件部署估算 (RU)容量功能探索

TiDB 社区干货传送门

TiDB 源码解读 新版本/特性解读

【创新视角】解锁淘宝商品详情API:让商品主图与详情图“跃然屏上”,重塑购物体验魅力!

代码忍者

API 接口 pinduoduo API

HyperWorks基于 Shrink Warp Mesh 的零部件网格剖分

智造软件

仿真 仿真软件 Hypermesh

ticdc 同步延迟指标与原理解析

TiDB 社区干货传送门

6.x 实践

给前端介绍对象啦!(TypeScript版)(三)_文化 & 方法_Think体验设计_InfoQ精选文章