JavaScript对寄生组合式继承的理解
有关JavaScript的几种继承方式请移步JavaScript的几种继承方式
原型链的缺陷
SubType.prototype = new SuperType();
这样做的话,SuperType构造函数中的属性也会变成SubType原型中的属性,而我们需要SubType原型只继承SuperType原型
还有一点就是引用类型值属性的共享
寄生组合式继承的理解
为了结合原型链、组合继承和寄生式继承的优点,可以新建一个临时的类temp,temp.prototype指向父类的Prototype,然后创建一个temp实例,并给它加上一个constructor属性
这样,相当于用原型链的方法继承temp,由于temp的构造函数为空,所以只继承了原型上的属性,构造函数上的属性再用call或apply来继承
于是,我们可以把封装继承的函数进行修改,不使用object()或Object.create(),便于理解
//继承原型
function inheritPrototype(subType, superType){ //参数为两个类型的构造函数
var temp = function(){};
temp.prototype = superType.prototype;
var tempInstance = new temp(); //创建temp的实例tempInstance
//给temp的实例tempInstance添加constructor属性,指向subType,虽然不是真的prototype.constructor,但是用来实现继承的效果是我们想要的
tempInstance.constructor = subType;
subType.prototype = tempInstance; //原型链继承
}
function SuperType(name){
this.name = name;
this.colors = [];
}
SuperType.prototype.sayName = function(){};
function SubType(name, age){
//继承构造函数中的属性
SuperType.call(this, name);
this.age = age;
}
inheritPrototype(SubType, SuperType);
SubType.prototype.sayAge = function(){};
不用temp,直接SubType.prototype = SuperType.prototype?
因为SubType.prototype直接指向了SuperType.prototype,所以改变子类prototype中的属性的话,父类prototype中的属性也会被改变
例子:
//子类改变会影响父类的情况
function Animal(){
this.species = 'animal';
}
Animal.prototype.color = 'red';
function Cat(){
this.meow = 'meowmeowmeow';
}
function Dog(){
this.bark = 'bow-wow';
}
Cat.prototype = Animal.prototype;
Dog.prototype = Animal.prototype;
var cat = new Cat();
var dog = new Dog();
console.log(cat.color); //red
console.log(dog.color); //red
console.log(Animal.prototype.color); //red
Cat.prototype.color = 'blue';
console.log(cat.color); //blue
console.log(dog.color); //blue
console.log(Animal.prototype.color); //blue
//修正:将SubType的原型指向temp的一个临时创建的实例
function Animal(){
this.species = 'animal';
}
Animal.prototype.color = 'red';
function Cat(){
Animal.call(this);
this.meow = 'meowmeowmeow';
}
var temp = function(){};
temp.prototype = Animal.prototype;
var tempInstance = new temp();
tempInstance.constructor = Cat;
Cat.prototype = tempInstance;
var cat = new Cat();
console.log(cat.color); //red
console.log(Animal.prototype.color); //red
Cat.prototype.color = 'blue';
console.log(cat.color); //blue
console.log(Animal.prototype.color); //red
JavaScript对寄生组合式继承的理解的更多相关文章
- JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承
说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ...
- JavaScript寄生组合式继承分析
JavaScript寄生组合式继承特点: 避免了在子类prototype上创建不必要多余的属性,相比直接继承基类的实例效率要高. 是JavaScript 实现继承的最有效方式. <script& ...
- javascript中的继承-寄生组合式继承
前文说过,组合继承是javascript最常用的继承模式,不过,它也有自己的不足:组合继承无论在什么情况下,都会调用两次父类构造函数,一次是在创建子类原型的时候,另一次是在子类构造函数内部.子类最终会 ...
- JavaScript高级程序设计之寄生组合式继承
在继承中常会出现两个问题: 父类的属性变成了子类的原型 构造器指向混乱 寄生组合式继承解决了这样的问题: 属性继承到属性 原型继承到原型 构造器指向明确 // 父类 var Super = funct ...
- javaScript设计模式之面向对象编程(object-oriented programming,OOP)--寄生组合式继承
组合式继承:将类式继承同构造函数继承组合使用,但是存在一个问题,子类不是父类的实例,而子类的原型式父类的实例,所以才有了寄生组合式继承. 意思就是说,寄生就是寄生式继承,寄生式继承就是依托于原型继承, ...
- [js高手之路]寄生组合式继承的优势
在之前javascript面向对象系列的文章里面,我们已经探讨了组合继承和寄生继承,回顾下组合继承: function Person( uName ){ this.skills = [ 'php', ...
- js组合继承和寄生组合式继承比较
本文是原创文章,如需转载,请注明文章出处 1.js中实现组合继承(B继承A): function A(name){ this.name = name; this.ary = ["AA&quo ...
- 详解js中的寄生组合式继承
寄生组合式继承是js中最理想的继承方式, 最大限度的节省了内存空间. js中的寄生组合式继承要求是: 1.子对象有父对象属性的副本, 且这些不应该保存在子对象的prototype上. 2. ...
- 寄生组合式继承 js
寄生组合式继承是集寄生式继承和组合继承的优点于一身,是基于类型继承最有效的方式 function object(o){ function F(){}; F.prototype = o; return ...
随机推荐
- 一个asp采集程序
<% if request.QueryString="" then url="http://www.hbcz.gov.cn:7001/XZQHQueryWAR/xx ...
- 使用maven打包的注意事项
maven编译项目的时候,默认使用的GBK,而目前大部分代码都使用的UTF-8的方式,所以这时候打出来的包容易出现乱码. 解决方式: <!-- compiler插件, 设定JDK版本 --> ...
- T-SQL 语句的理解
1.T-SQL中各子句在逻辑上按照以下顺序进行处理 . . . .. .ORDER BY 查询实例: SELECT EMPID, YEAR(ORDERDATE) AS ORDERYEAR, COUNT ...
- (原)android补间动画(四)之插补器Interpolator
比如说一段旋转动画 RotateAnimation animation = new RotateAnimation(0, 360, mMoveCircle.getMeasuredWidth() / 2 ...
- 【Network】高性能 UDP 应该怎么做?
参考资料: EPOLL-UDP-GOLANG golang udp epoll - Google 搜索 go - golang: working with multiple client/server ...
- Java、JVM模型
程序计数器:记录当前线程的执行位置(便于CPU切换线程的时候执行) 虚拟机栈:Java方法,方法从调用到执行完成对应一个栈帧从虚拟机栈入栈到出栈的过程. 本地方法区:Native方法(C++) 方法区 ...
- (转: daifubing的博客 )Delphi二维码中文支持、分组、批量打印经验小结
一直也没接触到什么复杂的报表,都是一些简单的报表,在DelphI下使用QuickReport一般也就能满足需要了,由于公司现在需求的变化,对条码扫描提出了新的要求,主要是扫码要包含更多地内容,以前的一 ...
- jquery 控件赋值
input 文本框赋值$("#id").attr("赋值"); input 文本框清空$("#id").attr("") ...
- 编译带有PROJ4和GEOS模块的GDAL
1.下载三个软件的源代码(去各自官网下载即可) 2.将PROJ4和GEOS的源码放到GDAL目录下的supportlibs文件夹中. 3.修改GDAL的nmake.opt文件,部分内容如下: # Un ...
- Android 某些配置记录
1, system image 大小配置: devices/intel/baytrail/ffrd8/BoardConfig.mk : BOARD_SYSTEMIMAGE_PARTITION_SIZ ...