Javascript编程之继承实例汇总

所属分类: 网络编程 / JavaScript 阅读数: 1531
收藏 0 赞 0 分享

本文实例讲述了Javascript编程之继承。分享给大家供大家参考,具体如下:

这篇文字是在看完《Javascript 王者归来》后的整理总结,文章详细章节在 第21章 P537

继承一般要实现以下三层含义:

1)子类实例可以共享父类的方法;
2)子类可以覆盖父类的方法或者扩展新的方法;
3)子类和父类都是子类实例的类型。

一、构造继承法

子类中调用父类的构造函数来维护的,该继承法能实现多重继承,但只能继承父类的共有方法,无法继承静态方法,而且不能用instanceof来验证实例。

function a(){
  this.say=function(){
  alert("happy new year!");
  }
}
function b(){
  a.apply(this,arguments);
}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
var oB=new b();
alert(oB instanceof a);// false
oB.say();       // happy new year
oB.fuck();       // 读不到

二、原型继承法/经典继承法

该继承法是通过复制已经存在的原型对象来实现行为重用,让对象实例共享原型对象的属性。支持多重继承,继承原型静态方法,能用instanceof来验证实例。

function a(){
 this.say=function(){
 alert("happy new year!");
 }
}
function b(){}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
a.prototype.z=123;
b.prototype=new a();
var oB=new b();
alert(oB instanceof a); // true
alert(oB.z);      // 123
oB.say();        // happy new year
oB.fuck();       // %^&%^&%&^%&

三、实例继承法/寄生构造函数模式

构造法不能继承类型的静态方法,原型继承得不完善(某些核心对象的不可枚举方法不能继承),而实例继承法能对原生核心对象或者DOM对象进行继承,它通过在类型中构造对象并返回的办法来实现继承,因此instanceof验证会是false,不支持多重继承。

function a(){
 var oA=new Array();
 oA.say=function(){
   alert("hello A!");
 }
 return oA;
}
var obj=new a();
alert(obj instanceof a); // false
obj.say();

四、拷贝继承法

该方法通过拷贝基类对象的所有可枚举属性和方法来模拟继承,因此它可以模拟多继承,但不能枚举的就无法继承;它可以继承父类的静态方法;

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year!");
  }
}
function b(){
  this.extends=function(obj){
    for(each in obj){
      this[each]=obj[each];
    }
  }
}
var oB=new b();
oB.extends(new a());
alert(oB instanceof a); // false
alert(oB.num);     // 123
oB.say();        // happy new year

五、混合继承法

顾名思义就是把上面几种继承法综合起来,取长补短,让继承更完善。常见的有 构造+原型继承:伪经典继承

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year!");
  }
}
function b(){
  a.apply(this);
}
b.prototype=new a();
b.prototype.z=123;
var oB=new b();
alert(oB instanceof a); // true
alert(oB.num);     // 123
oB.say();        // happy new year

六、各种继承法的优缺点

希望本文所述对大家JavaScript程序设计有所帮助。

更多精彩内容其他人还在看

BootStrap数据表格实例代码

本文通过实例代码给大家分享了BootStrap数据表格的相关知识,感兴趣的朋友一起看看吧
收藏 0 赞 0 分享

基于vue的短信验证码倒计时demo

这篇文章主要介绍了基于vue的短信验证码倒计时demo,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

详解React Native开源时间日期选择器组件(react-native-datetime)

本篇文章主要介绍了详解React Native开源时间日期选择器组件(react-native-datetime),具有一定的参考价值,有兴趣的可以了解一下
收藏 0 赞 0 分享

JS库particles.js创建超炫背景粒子插件(附源码下载)

particles.js用于创建粒子的轻量级 JavaScript 库。使用方法非常简单,代码也很容易实现,下面通过本文给大家分享JS库particles.js创建超炫背景粒子插件附源码下载,需要的朋友参考下吧
收藏 0 赞 0 分享

JS库之Waypoints的用法详解

waypoints的功能非常强大,一款用于捕获各种滚动事件的插件,下面跟随脚本之家小编一起学习JS库之Waypoints的用法吧
收藏 0 赞 0 分享

强大的JavaScript响应式图表Chartist.js的使用

本篇文章主要介绍了强大的JavaScript响应式图表Chartist.js的使用,具有一定的参考价值,有兴趣的可以了解一下
收藏 0 赞 0 分享

详解wow.js中各种特效对应的类名

本篇文章主要介绍了wow.js中各种特效对应的类名 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JS库之Highlight.js的用法详解

highlight.js是一款轻量级的Web代码语法高亮库。下面通过实例代码给大家分享JS库之Highlight.js的用法详解,感兴趣的朋友跟随脚本之家小编一起学习吧
收藏 0 赞 0 分享

详解动画插件wow.js的使用方法

本篇文章主要介绍了动画插件wow.js的使用方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JS库 Highlightjs 添加代码行号的实现代码

Highlightjs是一款优秀的代码高亮Js组件,可以很方便地对各种语言编写的代码添加语法高亮样式。本文重点给大家介绍Highlightjs 添加代码行号的实现代码,需要的朋友参考下吧
收藏 0 赞 0 分享
查看更多