多态(Polymorphism)按字面的意思就是“多种状态”,同样的行为(方法)在不同对象上有不同的状态。
  在OOP中很多地方都要用到多态的特性,比如同样是点击鼠标右键,点击快捷方式、点击桌面空白处、点击任务栏等弹出的菜单都是不同的。

方法重写(override):

  即子类定义一个与父类名字相同的方法,以此覆盖父类方法,以此来实现不同的功能。

     function Animal(){}
var AnimalP = Animal.prototype;
AnimalP.eat = function(food){
console.log('这个动物正在吃' + food);
}; function Snake(){}
var SnakeP = extend(Snake,Animal);//extend函数请看上一节
/*snake没有对eat方法重写,继承的父类eat()方法*/
function Dog(){}
var DogP = extend(Dog,Animal);
DogP.eat = function(food){
/*对eat()方法重写*/
/*上一章讲过,也可以在这里通过 Animal.eat.call(this,food)调用父方法;*/
console.log("这只狗正在吃"+food);
}; function Cat(){}
var CatP = extend(Cat,Animal);
CatP.eat = function(food){
console.log("这只猫正在吃"+food);
};
var snake = new Snake();
snake.eat('老鼠');//log:这个动物正在吃老鼠
var dog = new Dog();
dog.eat('骨头');//log:这只狗正在吃骨头
var cat = new Cat();
cat.eat('鱼');//log:这只猫正在吃鱼

抽象类(abstract class):

  上面的代码中,Snake类没有实现自己的eat()方法,但有的时候我们希望子类一定要有某个方法(抽象方法),这样可以规范子类的行为,这时候就要用到抽象类,
  ES5、ES6都没有抽象类的概念的,所以我们只能通过模拟来实现,让我们接着上面的代码,假如我们要把Animal的eat()方法定义为抽象方法:

     AnimalP.eat = function(food){
/*定义抽象方法(虚函数),如果子类没有重写这个方法,在执行这方法的时候就会抛出错误*/
throw '"' + this.constructor.name + "'类没有eat()方法";
};
function Snake(){}
var SnakeP = extend(Snake,Animal);
var snake = new Snake();
snake.eat('老鼠');//throw:"Snake'类没有eat()方法

方法重载(overload):

  我们一定写过这样的函数,根据传入的参数不一样(类型、参数个数),方法的运行结果也不一样:

 var run = function(speed){
if(typeof speed == 'number'){
console.log('跑的速度有' + speed + 'm/s');
}else if(typeof speed == 'string'){
console.log('跑的速度有' + speed);
}
}
run(15);//log:跑的速度有15m/s
run('20KM/h');//log:跑的速度有20KM/h

   但上面这样写明显代码难维护,可以把run方法作为一个接口,根据参数的类型执行不同方法,用在类中就向下面一样:

     function Dog(){}
var DogP = Dog.prototype;
DogP.run = function(speed){
if(typeof speed == 'number'){
this._runNumber(speed);
}else if(typeof speed == 'string'){
this._runString(speed);
}else{
throw '参数不匹配';
}
}
DogP._runString = function(speed){
console.log('这只狗跑的速度有' + speed);
}
DogP._runNumber = function(speed){
console.log('这只狗跑的速度有' + speed + 'm/s');
}
var dog = new Dog();
dog.run(15);//log:这只狗跑的速度有15m/s
dog.run('20KM/h');//log:这只狗跑的速度有20KM/h
dog.run([]);//throw:参数不匹配

  这就是方法重载的模拟,但实际上,ES5、ES6、typescipt都不支持语法上的方法重载,typescipt也只是支持函数重载。
  这是多态的另一种实现方式。

Demo by ES6:

     class Animal{
eat(food){
throw '"' + this.constructor.name + "'类没有eat()方法";
}
}
class Snake extends Animal{}
class Dog extends Animal{
eat(food){
console.log("这只狗正在吃"+food);
}
}
class Cat extends Animal{
eat(food){
console.log("这只猫正在吃"+food);
}
}
let snake = new Snake();
snake.eat('老鼠');//throw:"Snake'类没有eat()方法
let dog = new Dog();
dog.eat('骨头');//log:这只狗正在吃骨头
let cat = new Cat();
cat.eat('鱼');//log:这只猫正在吃鱼

Demo by TypeScript:

 abstract class Animal{//定义抽象类Animal
constructor(){}
abstract eat(food: string){}
/*定义抽象方法eat(),并且限定传入的参数类型是string,
还可以定义返回值,接口等,如果子类不符合限定的规范,编译的时候就会报错。
*/
}
class Snake extends Animal{}//报错,无法通过编译,因为没有定义eat()抽象方法
class Dog extends Animal{
eat(food: string){
console.log("这只狗正在吃"+food);
}
}
class Cat extends Animal{
eat(food: string){
console.log("这只猫正在吃"+food);
}
}
let dog = new Dog();
dog.eat('骨头');//log:这只狗正在吃骨头
let cat = new Cat();
cat.eat('鱼');//log:这只猫正在吃鱼

后话

  如果你喜欢作者的文章,记得收藏,你的点赞是对作者最大的鼓励;

  面向对象的主要知识点在这里就讲完了,这些东西仅仅是基础,我讲的肯定不够完善,仅仅是为了让大家快速入门,建议大家有时间的话还是系统的看书学习一下js OOP;

  本系列还有最后一章,会把前几张讲的知识点通过一个案例整合在一起,让大家可以更好的消化吸收,大概会酝酿两周的时间;

  大家有什么疑问可以留言或私信作者,作者尽量第一时间回复大家;

  如果老司机们觉得那里可以有不恰当的,或可以表达的更好的,欢迎指出来,我会尽快修正、完善。

JavaScript面向对象轻松入门之多态(demo by ES5、ES6、TypeScript)的更多相关文章

  1. JavaScript面向对象轻松入门之封装(demo by ES5、ES6、TypeScript)

    本章默认大家已经看过作者的前一篇文章 <JavaScript面向对象轻松入门之抽象> 为什么要封装? 封装(Encapsulation)就是把对象的内部属性和方法隐藏起来,外部代码访问该对 ...

  2. JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)

    写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...

  3. JavaScript面向对象轻松入门之继承(demo by ES5、ES6)

    继承是面向对象很重要的一个概念,分为接口继承和实现继承,接口继承即为继承某个对象的方法,实现继承即为继承某个对象的属性.JavvaScript通过原型链来实现接口继承.call()或apply()来实 ...

  4. JavaScript面向对象轻松入门之抽象(demo by ES5、ES6、TypeScript)

    抽象的概念 狭义的抽象,也就是代码里的抽象,就是把一些相关联的业务逻辑分离成属性和方法(行为),这些属性和方法就可以构成一个对象. 这种抽象是为了把难以理解的代码归纳成与现实世界关联的概念,比如小狗这 ...

  5. JavaScript面向对象轻松入门之综合

    javascrpit面向对象之综合   这一章是对前几章的一个总结,通过一个案例来综合认识javascript面向对象的基本用法   需求: 几乎所有的web应用都需要保存数据一些到本地,那么我们就来 ...

  6. javascript面向对象:继承、多态

    继承 js中同样可以实现类的继承这一面向对象特性,继承父类中的所有成员(变量和属性),同时可扩展自己的成员,下面介绍几种js中实现继承的方式: 1,对象模仿:通过动态的改变 this 指针的指向,实现 ...

  7. JavaScript面向对象编程入门

    来源极客网 function Person() { var _this = {} //创建一个空的对象,接着我们利用这个"空的对象"承载Person的属性和方法 _this.say ...

  8. JavaScript 面向对象程序设计(下)——继承与多态 【转】

    JavaScript 面向对象程序设计(下)--继承与多态 前面我们讨论了如何在 JavaScript 语言中实现对私有实例成员.公有实例成员.私有静态成员.公有静态成员和静态类的封装.这次我们来讨论 ...

  9. Swift轻松入门——基本语法介绍和详细地Demo讲解(利用WebView打开百度、新浪等网页)

    转载请务必注明出处(all copyright reserved by iOSGeek) 本文主要分为两个部分,第一部分介绍Swift的基本语法,第二部分讲解一个利用WebView来打开百度.sina ...

随机推荐

  1. 关于初学loadrunner的心得体会

    自参加工作两年以来,深感个人知识底蕴浅薄,为此,自身也在多方寻找所需业务技能.loadrunner负载测试工具,作为性能测试典型工具之一,对于我个人的知识的丰富化起到一定作用,但也仅仅是对工作能力的略 ...

  2. SQLite 之 C#版 System.Data.SQLite 使用

    简介 SQLite简介 SQLite,是一款轻型的关系型数据库.它的设计目标是嵌入式. 它能够支持Windows/Linux/Unix等等主流的操作系统,同时能够跟很多程序语言相结合,比如 C++.C ...

  3. jquery源码 Callback

    工具方法.对函数的统一管理. jquery2.0.3版本$.Callback()部分的源码如下: // String to Object options format cache var option ...

  4. Unicode字符集和编码方式

    通常将一个标准中能够表示的所有字符的集合称为字符集,比如ISO/Unicode所定义的字符集为Unicode.在Unicode中,每个字符占据一个码位/Unicode 编号(用4位十六进制数表示,Co ...

  5. 第十五章(附)分布式缓存-Memcached

    一.概念 Memcached是danga.com(运营LiveJournal的技术团队)开发的一套分布式内存对象缓存系统,用于在动态系统中减少数据库负载,提升性能. 二.适用场合 1.分布式应用.由于 ...

  6. RabbitMQ系列教程之一:我们从最简单的事情开始!Hello World

    一.简介      RabbitMQ是一个消息的代理器,用于接收和发送消息,你可以这样想,他就是一个邮局,当您把需要寄送的邮件投递到邮筒之时,你可以确定的是邮递员先生肯定会把邮件发送到需要接收邮件的人 ...

  7. Wampserver红色橙色解决思路----端口冲突是关键

    Wampserver不是绿色:wampserver下载安装不需要配置环境,在这之前需要下载tomcat,并确保启动,不然会是红色.安装好wampserver(就是在安装过程不会弹出缺少什么文件,我的就 ...

  8. js添加多个样式属性cssText

    document.getElementById("box").style.cssText += ";color:red;font-size:20px"; 代码分 ...

  9. (转) Java RMI 框架(远程方法调用)

    "原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://haolloyin.blog.51cto.com/1177454/33 ...

  10. Web前端性能优化全攻略

    网页制作poluoluo文章简介:Web 前端性能优化是个大话题,是个值得运维人员持续跟踪的话题,是被很多网站无情忽视的技术. Web 前端性能优化是个大话题,是个值得运维人员持续跟踪的话题,是被很多 ...