推荐JavaScript实现继承的最佳方式


Posted in Javascript onNovember 11, 2014

   实现JavaScript继承的最简单的方式是call方法(或者apply方法)及原型链方法,但这两种方法都有缺陷,而其混合体就是很好的继承实现方式。下面举例说明:

function Animal(age){

    this.age = age;

}

Animal.prototype.sayAge = function(){

    window.alert("My age is "+this.age+"!");

};

function Dog(age,name){

    Animal.call(this,age);

    this.name = name;

}

Dog.prototype = new Animal();

Dog.prototype.sayName = function(){

    window.alert("I am a "+this.name+"!");

};

var dog = new Dog(15,"dog");

dog.sayName();

dog.sayAge();

    对于类Animal来说,它有一个字段属性age及函数属性sayAge,sayAge方法的定义采用的是原型方式。Dog类要继承Animal,其字段属性除了age外还有name,通过Animal.call(this,age);可以实现Dog继承Animal的字段属性age并将其初始化了。call方法的第一个参数为继承的类的this指针,第二个参数为Animal类的构造函数的参数。实际上,只是通过call方法就可以实现继承,但唯一的要求是父类的函数属性要在构造函数中定义,这对于这里的函数属性使用原型方式定义来说就不适合了(采用原型方式定义函数属性比在构造函数内定义更直观一些)。要想继承Animal的原型方式定义的函数属性,需要的语句就是“Dog.prototype = new Animal();”。而Dog类中的sayName()函数则是其自身的函数属性了。

 除了这个最经典的实现继承的方式外,目前还有一些免费的库可供使用。但想到形形色色的库,头就大了,有时间有必要时再研究吧!

Javascript 相关文章推荐
js中window.open()的所有参数详细解析
Jan 09 Javascript
通过onmouseover选项卡实现img图片的变化
Feb 12 Javascript
javascript实现随机生成DIV背景色
Jun 20 Javascript
web打印小结
Jan 11 Javascript
bootstrap的常用组件和栅格式布局详解
May 02 Javascript
Angularjs中ng-repeat的简单实例
Aug 25 Javascript
打通前后端构建一个Vue+Express的开发环境
Jul 17 Javascript
vue路由切换之淡入淡出的简单实现
Oct 31 Javascript
jsonp格式前端发送和后台接受写法的代码详解
Nov 07 Javascript
微信小程序实现单个卡片左滑显示按钮并防止上下滑动干扰功能
Dec 06 Javascript
vue data有值,但是页面{{}} 取不到值的解决
Nov 09 Javascript
springboot+vue实现文件上传下载
Nov 17 Vue.js
使用 js+正则表达式为关键词添加链接
Nov 11 #Javascript
jQuery 动态云标签插件
Nov 11 #Javascript
javascript 回调函数详解
Nov 11 #Javascript
JSON格式化输出
Nov 10 #Javascript
再谈javascript原型继承
Nov 10 #Javascript
让angularjs支持浏览器自动填表
Nov 10 #Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
Nov 10 #Javascript
You might like
PHP处理bmp格式图片的方法分析
2017/07/04 PHP
基于jquery实现图片广告轮换效果代码
2011/07/07 Javascript
深入理解jQuery中live与bind方法的区别
2013/12/18 Javascript
js 获取、清空input type="file"的值示例代码
2014/02/19 Javascript
使用Nodejs开发微信公众号后台服务实例
2014/09/03 NodeJs
jQuery控制Div拖拽效果完整实例分析
2015/04/15 Javascript
jQuery+HTML5美女瀑布流布局实现方法
2015/09/21 Javascript
JS实现仿微博可关闭弹出层效果
2015/09/21 Javascript
如何在Linux上安装Node.js
2016/04/01 Javascript
jQuery实现的tab标签切换效果示例
2016/09/05 Javascript
JS判断是否手机或pad访问实现方法
2016/12/09 Javascript
HTML5canvas 绘制一个圆环形的进度表示实例
2016/12/16 Javascript
Node.js 使用jade模板引擎的示例
2018/05/11 Javascript
vue中如何实现pdf文件预览的方法
2018/07/12 Javascript
解决vue+router路由跳转不起作用的一项原因
2020/07/19 Javascript
在vue中实现禁止回退上一步,路由不存历史记录
2020/07/22 Javascript
vue3弹出层V3Popup实例详解
2021/01/04 Vue.js
[01:08]DOTA2次级职业联赛 - Wings 战队宣传片
2014/12/01 DOTA
Python编程实现及时获取新邮件的方法示例
2017/08/10 Python
Python简单实现控制电脑的方法
2018/01/22 Python
Python使用Django实现博客系统完整版
2020/09/29 Python
解决pip install的时候报错timed out的问题
2018/06/12 Python
Python迭代器与生成器用法实例分析
2018/07/09 Python
使用PyTorch将文件夹下的图片分为训练集和验证集实例
2020/01/08 Python
如何使用python代码操作git代码
2020/02/29 Python
Django:使用filter的pk进行多值查询操作
2020/07/15 Python
Python内置函数及功能简介汇总
2020/10/13 Python
多个版本的python共存时使用pip的正确做法
2020/10/26 Python
马来西亚最好的婴儿商店:Motherhood
2017/09/14 全球购物
自考毕业生自我鉴定
2013/11/04 职场文书
《夏夜多美》教学反思
2014/02/17 职场文书
数控专业毕业生求职信
2014/06/12 职场文书
2014年社区党建工作汇报材料
2014/11/02 职场文书
2014年大学班长工作总结
2014/11/14 职场文书
2015年基层党建工作汇报材料
2015/06/25 职场文书
MongoDB支持的索引类型
2022/04/11 MongoDB