javascript面向对象之Javascript 继承
JavaScript继承 面向对象
2023-09-14 09:02:22 时间
转自原文 javascript面向对象之Javascript 继承
在JavaScript中实现继承可以有多种方法,下面说两种常见的。
一,call 继承
先定义一个“人”类
//人类 Person=function(){ this.name="草泥马"; this.eat=function(){ alert("我要吃饭"); } this.sleep=function(){ alert("我要睡觉"); } }
再定义一个学生类,让它继承于Person
//学生类 Student=function(){ Person.call(this);//继承Person类 this.doHomework=function(){ alert("老师来了,作业借我抄下"); } }
关键看 Person.call(this)这句,其中this代表当前对象,即Student ,这很容易理解,而Person.call(this)的意思是:将Person类的所有的公开成员“附加”给Student类,让Student也具有了Person的所有功能。
和高级语言一样,如果子类中出现了和父类中同名的成员,则会将其覆盖,也就是所谓的“重写”了。
同样的,我们再定义一个女孩类 :
//女孩类 Girl=function(){ Person.call(this);//继承Person类 this.sex="女"; }
JavaScript是可以实现多重继承的,请看下面的Master(硕士)类,这个Master 自然是个学生,但同时又是个漂亮MM,于是有了下面的代码:
//硕士类 Master=function(){ Student.call(this);//继承Student类 Girl.call(this);//继承Girl类 this.degree="硕士";//学历 }
tset
var master=new Master(); master.name="凤姐"; master.eat(); master.doHomework();
alert("偶是名字叫:"+master.name); alert("偶的性别是:"+master.sex);
多重继承时要注意顺序,如果两个类中有相同名称的成员,那么后一个将覆盖前一个,也就是说当前类只会继承后一个类中的成员。
call 方法继承就说到这,如果大家对call方法不清楚,就请去问问谷歌兄,我就不赘述了,网上转载得不要太多。下面说下另外一种继承方式。
二、prototype 原型继承
我们再定义一个班长类:
//班长类 SquadLeader=function (){ //打招呼 this.hi=function(){ alert("同学们好,我现在是班长了"); } }
上面定义了一个硕士类,现在这个硕士被提升为班长了,所以这个Master要继承SquadLeader了,这次我们用prototype 来实现,请看下面代码:
Master.prototype=new SquadLeader();//prototype 属性指向一个对象 // 或者 // Master.prototype=SquadLeader.prototype; // 这样Master就继承了SquadLeader类,就这么一句话,这里有两种形式,其实原理是一样的。意思是:将SquadLeader的“灵魂”拷贝给了Master,于是从此SquadLeader能做的事,Master都可以做了。
// 测试一下: var master=new Master(); master.hi()//输出“同学们好,我现在是班长了”
我个人比较喜欢用第一种方案(call 继承)来实现继承,所有代码都包在一个“{}”内,一目了然,在书写风格上较之于第二种更接近于C#。prototype 属性我一般用来对已有的类做扩展。
JavaScript是门非常灵活的语言,实现继承可能还有其他更好的方式,大家可以去研究挖掘。
相关文章
- html5 scrollheight,JavaScript之scrollTop、scrollHeight、offsetTop、offsetHeight等属性学习笔记…[通俗易懂]
- 【说站】javascript寄生式继承的使用
- JavaScript 函数 window.matchMedia 的用途
- JavaScript学习总结(二十)——Javascript非构造函数的继承详解编程语言
- JavaScript学习总结(五)——Javascript中==和===的区别详解编程语言
- JavaScript中令你抓狂的魔术变量
- 用JavaScript实现字符串切分功能
- javascript一段创建层的代码
- Javascript常用运算符(Operators)-javascript基础教程
- Javascript阻止javascript事件冒泡,获取控件ID值
- JavaScript继承详解(一)
- javascript类继承机制的原理分析
- javascript面向对象继承
- javascript打开页面window.location和window.open的区别
- Javascript面向对象继承
- JavaScript继承方式实例
- JavaScript高级程序设计阅读笔记(十六)javascript检测浏览器和操作系统-detect.js
- javascript继承之为什么要继承
- javascript实现原生ajax的几种方法介绍
- 深入理解JavaScript中的传值与传引用
- javascript实现数字验证码的简单实例
- JavaScript实现继承的4种方法总结
- Javascript学习指南
- javascript数据类型示例分享