javascript每日必学之多态


Posted in Javascript onFebruary 23, 2016

朋友们大家好,今天我们就接着前面的内容讲,前面我们已经讲到了继承,今天我们就来讲OOP目前最后一个体现,那就是多态,因为javascript语言的灵活性,所以我们是没有办法使用接口的,所以这也给js程序带来了一定的困惑,大家也不用太着急关心这个问题,因为这些到后面ECMAScript后面的版本会给我们解决这些问题的,又扯远了,还是回到正题,OOP的多态,前面我们已经可以很明白的理解继承是什么样子的了,就是先声明一个父类,然后,我们可以写很多的子类来继承父类的属性和方法,这些我们就可以用最少的代码量,实现了与父类一样的功能,这就是继承。马上就有同学提出疑问:前面的继承我看了很久,也能有理解,但主是不知道有什么用,为什么我们要去写那么多的继承类?这个问题,立马切中要害,问得相当的关键,如果没有多态的存在,我们先前所说的继承还真没什么用,因为我们所有的继承类都是一模一样的复制,没有什么特点。举个例子:

javascript每日必学之多态

我们可以很明显地就看出问题来了,熊猫A,熊猫B与父类的熊猫完全一样,虽然,我们可以很轻松写很多个子类来,但是,这并没有什么用,我们就直接使用父类的属性和方法,就能达到我们的目的,对,这样说,感觉OOP的继承没有什么用了,前面我们才学到的知识,不会就这样浪费了吧,哈哈,不要怕,前面只要只是你所学到的东西,完全没有白学,下面我们就来讲继承的补充,多态,看示例图:

javascript每日必学之多态

不管是人类,还是其他动物,不断的繁衍,不断的进化,每一个后代看似一样,其实又不一样,或多或少都有自己的独特的属性或者行为,现在熊猫A在某种特别的情况下学会了洗澡,它有自己的卫生属性,而熊猫B是个高手,学会了泡妞(大爷的,老子都没学会,它学会了),它有了自己的魅力属性,这样我们就可以很清晰看出来,当我们需要写一个子类来继承父类的时候,它一定是具有和父类相同行为或者属性而且还一定具有自己独特的行为或者属性,这样我们就省去了相同行为或者属性的代码编写(OOP思想带来的好处再一次被体现),下面我们来看实例代码:

//遗传继承函数
function Extend(Children,Parent){
  for(var p in Parent){
    if(typeof Children[p] == "undefined"){
      Children[p] = Parent[p];
    }
  }
}

//熊猫父类
function Panda(){
  //颜色
  this.color = "黑色交错";
  //健康值
  this.health = 100;
  //可爱值
  this.lovely = 80;
  //年龄
  this.age = "3岁";
}
//吃
Panda.prototype.Eat = function(){
  console.log("吃竹子");
}
//拉
Panda.prototype.Shit = function(){
  console.log("拉了一坨翔");
}
//睡
Panda.prototype.Sleep = function(){
  console.log("美美地睡了一整天");
}
//交配
Panda.prototype.Mating = function(){
  console.log("熊猫的爱爱也是为了下一代嘛");
}

//熊猫A
function Panda_A(){
  //讲卫生度
  this.lovehealth = 60;
  
  Extend(this,new Panda());
}
//洗澡
Panda_A.prototype.Bath = function(){
  console.log("为了不生病,就得讲卫生,我去洗澡了");
  //洗一次澡,讲卫生程度 + 1
  this.lovehealth += 1;
}

//熊猫B
function Panda_B(){
  //魅力值
  this.charm = 90;
  
  Extend(this,new Panda());
}
//泡妞
Panda_B.prototype.GetGirls = function(){
  console.log("为了族群的繁荣,我就先去泡妞去了,谁叫我的魅力这么高呢?");
  //泡一次妞,魅力值 - 1
  this.charm -= 1;
}

下面我们看一看示例,是不是跟前面描述的一样?

javascript每日必学之多态

不管是父类的实例,还是子类的实例,都能正常的使用父类(共有)的属性及行为函数,下面再来看看特有的呢?

javascript每日必学之多态

再来大家最关心的那个行为还没测试,就是熊猫B可以泡妞,不再调大家的口味了,立马测试

javascript每日必学之多态

能过上面的示例,我们已经知道多态是怎么一回事了,现在又有同学发问了:前面我们已经可以实现多态了,只是看到多了一些特有的属性和行为,那么可不可以改变一些原有属性及行为呢?因为要模拟对象,我们就要做到尽量相同的模拟,就像,如果还有一个熊猫C类,他们进化得更高级了,已经不用吃竹子了,居然学人开始吃饭了:

//熊猫C
function Panda_C(){
  
  Extend(this,new Panda());
}
//吃
Panda_C.prototype.Eat = function(){
  //吃饭
  console.log("我们要进化得比人类更高级,所以我们就开始吃饭了,不再吃竹子!!");
}

javascript每日必学之多态

看到了吧,只要是与父类已经不相同的属性或者行为,我们都可以通过重写的方式来进行覆盖,从而实现子类变态的特殊要求。

总结一下,今天我们就补充前面继承的思想,从而实现了多态的模拟,OOP思想,我们也先就告一段落,相信大家已经对OOP有了自己的认识,就是把代码模拟成对象来进行编写,这样有两个好处:

1、把代码的重用率提高了,提高了工作效率。

2、代码已经被模拟在对象,这样有条理代码方便了我们管理,和后期维护及扩展。

以上就是本文的全部内容,希望对大家的学习有所帮助。

Javascript 相关文章推荐
在次封装easyui-Dialog插件实现代码
Nov 14 Javascript
基于JQuery制作的产品广告效果
Dec 08 Javascript
js中eval()函数和trim()去掉字符串左右空格应用
Feb 02 Javascript
ES6学习之变量的解构赋值
Feb 12 Javascript
jQuery实现简单弹窗遮罩效果
Feb 27 Javascript
JavaScript条件判断_动力节点Java学院整理
Jun 26 Javascript
Vue.js实现实例搜索应用功能详细代码
Aug 24 Javascript
vue-cli如何引入bootstrap工具的方法
Oct 19 Javascript
React Native使用百度Echarts显示图表的示例代码
Nov 07 Javascript
基于JavaScript实现五子棋游戏
Aug 26 Javascript
如何使用electron-builder及electron-updater给项目配置自动更新
Dec 24 Javascript
JS自定义对象创建与简单使用方法示例
Jan 15 Javascript
javascript每日必学之继承
Feb 23 #Javascript
JS实现的仿QQ空间图片弹出效果代码
Feb 23 #Javascript
理解javascript封装
Feb 23 #Javascript
学习Javascript面向对象编程之封装
Feb 23 #Javascript
javascript每日必学之封装
Feb 23 #Javascript
jQuery常用知识点总结以及平时封装常用函数
Feb 23 #Javascript
使用Javascript实现选择下拉菜单互移并排序
Feb 23 #Javascript
You might like
一个PHP+MSSQL分页的例子
2006/10/09 PHP
php中将指针移动到数据集初始位置的实现代码[mysql_data_seek]
2012/11/01 PHP
php中把美国时间转为北京时间的自定义函数分享
2014/07/28 PHP
ThinkPHP独立分组使用的注意事项
2014/11/25 PHP
PHP人民币金额转大写实例代码
2015/10/02 PHP
PHP实现负载均衡下的session共用功能
2018/04/17 PHP
PHP微信支付结果通知与回调策略分析
2019/01/10 PHP
基于jQuery的日期选择控件
2009/10/27 Javascript
Tips 带三角可关闭的文字提示
2010/10/06 Javascript
一个简单的js树形菜单
2011/12/09 Javascript
jquery 年会抽奖程序
2011/12/22 Javascript
javascript页面上使用动态时间具体实现
2014/03/18 Javascript
JavaScript中Date对象的常用方法示例
2015/10/24 Javascript
jQuery实现切换页面过渡动画效果
2015/10/29 Javascript
JS中闭包的经典用法小结(2则示例)
2016/12/28 Javascript
ajax接收后台数据在html页面显示
2017/02/19 Javascript
ES6新特性:使用export和import实现模块化详解
2017/07/31 Javascript
浅析Angular19 自定义表单控件
2018/01/31 Javascript
JavaScript基础心法 数据类型
2018/03/05 Javascript
jQuery插件实现的日历功能示例【附源码下载】
2018/09/07 jQuery
详解vue中localStorage的使用方法
2018/11/22 Javascript
layui 弹出层值回传解决方式
2019/11/14 Javascript
[01:02:09]Liquid vs TNC 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21
2020/07/19 DOTA
解决Python一行输出不显示的问题
2018/12/03 Python
pyqt 实现QlineEdit 输入密码显示成圆点的方法
2019/06/24 Python
python使用sklearn实现决策树的方法示例
2019/09/12 Python
python 使用while写猜年龄小游戏过程解析
2019/10/07 Python
利用Python实现朋友圈中的九宫格图片效果
2020/09/03 Python
为女性购买传统的印度服装和婚纱:Kalkifashion
2019/07/22 全球购物
英国医生在线预约:Top Doctors
2019/10/30 全球购物
英国户外服装、鞋类和设备的领先零售商:Millets
2020/10/12 全球购物
Unix控制后台进程都有哪些进程
2016/09/22 面试题
临床医师专业个人自我评价
2014/01/08 职场文书
2015年教育实习工作总结
2015/04/24 职场文书
2016年端午节校园广播稿
2015/12/18 职场文书
生鲜超市—未来中国最具有潜力零售业态
2019/08/02 职场文书