JS 面向对象之继承---多种组合继承
1. 组合继承:又叫伪经典继承,是指将原型链和借用构造函数技术组合在一块的一种继承方式。
下面来看一个例子:
function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
alert(this.name);
}
function SubType(name, age) {
SuperType.call(this, name);
this.age = age;
}
//继承方法
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function() {
alert(this.age);
}
var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); //red,blue,green,black
instance1.sayName(); //Nicholas
instance1.sayAge(); //
var instance2 = new SubType("Greg", 27);
alert(instance2.colors); //red,blue,green
instance2.sayName(); //Greg
instance2.sayAge(); //
组合继承避免了原型链和借用构造函数的缺陷,融合它们的优点。
2. 原型式继承
可以在不必预先定义构造函数的情况下实现继承,其本质是执行对给定对象的浅复制。而复制得到的副本还可以得到进一步的改造。
function object(o) {
function F(){};
F.prototype = o;
return new F;
}
var person = {
name: "Nicholas",
friends: ["Shelby", "Court", "Van"]
};
var antherPerson = object(person);
antherPerson.name = "Greg";
antherPerson.friends.push("Rob");
var antherPerson = object(person);
antherPerson.name = "Linda";
antherPerson.friends.push("Barbie");
alert(person.friends); //Shelby,Court,Van,Rob,Barbie
3. 寄生式继承
与原型式继承非常相似,也是基于某个对象或某些信息创建一个对象,然后增强对象,最后返回对象。为了解决组合继承模式由于多次调用超类型构造函数而导致的低效率问题,可以将这个模式与组合继承一起使用。
function object(o) {
function F(){};
F.prototype = o;
return new F;
}
function createAnother(original) {
var clone = object(original);
clone.sayHi = function() {
alert("Hi");
};
return clone;
}
var person = {
name: "Nicholas",
friends: ["Shelby", "Court", "Van"]
};
var anotherPerson = createAnother(person);
anotherPerson.sayHi();
4. 寄生组合式继承
集寄生式继承和组合继承的优点与一身,是实现基本类型继承的最有效方式。
//继承原型
function extend(subType, superType) {
function F(){};
F.prototype = superType.prototype; var prototype = new F;
prototype.constructor = subType;
subType.prototype = prototype;
} //超类方法
function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
return this.name;
} //子类方法
function SubType(name, age) {
SuperType.call(this, name);
this.age = age;
} //继承超类的原型
extend(SubType, SuperType); //子类方法
SubType.prototype.sayAge = function() {
return this.age;
} var instance1 = new SubType("Shelby");
var instance2 = new SubType("Court", 28); instance1.colors.push('black'); alert(instance1.colors); //red,blue,green,black
alert(instance2.colors); //red,blue,green alert(instance1 instanceof SubType); //true
alert(instance1 instanceof SuperType); //true
这段例子的高效率体现在它只调用了一次SuperType构造函数,并且因此避免了在SubType.prototype上面创建不必要的多余的属性。与此同时,原型链还能保持不变。因此,还能正常使用instanceof 和 isPrototypeOf()。开发人员普遍认为寄生组合式继承是引用类型最理想的继承范式。
JS 面向对象之继承---多种组合继承的更多相关文章
- 三张图搞懂JavaScript的原型对象与原型链 / js继承,各种继承的优缺点(原型链继承,组合继承,寄生组合继承)
摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...
- JS面向对象的类 实例化与继承
JS中 类的声明有两种形式: // 类的声明 function Animal() { this.name = 'name' } // ES6中的class声明 class Animal2 { cons ...
- javascript学习笔记--经典继承、组合继承、原型式继承、寄生继承以及寄生组合继承
经典继承 js中实现经典继承的方式是通过构造函数来实现的,即在子类中对父类调用call方法. function Geometric() { this.time = ""; this ...
- 关于JS面向对象、设计模式、以及继承的问题总结
1.对象:JS中万物皆对象,它是一个泛指 类:对象的具体的细分 (物以类聚,人与群分.具有相同属性和方法的实例的一个集合总称) 实例:某一个类别中具体的一个事物 对象是一个抽象的概念,类似于我们的自然 ...
- [js高手之路]从原型链开始图解继承到组合继承的产生
基于javascript原型链的层层递进查找规则,以及原型对象(prototype)的共享特性,实现继承是非常简单的事情 一.把父类的实例对象赋给子类的原型对象(prototype),可以实现继承 f ...
- node.js面向对象实现(二)继承
http://blog.sina.com.cn/s/blog_b5a53f2e0101nrdi.html 继承是面向对象中非常重要的一个概念,那么在Node.js中如何实现继承呢? node.js在u ...
- JS继承之借用构造函数继承和组合继承
根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承 在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术( ...
- javascript实现继承3种方式: 原型继承、借用构造函数继承、组合继承,模拟extends方法继承
javascript中实现继承的三种方式:原型继承.借用构造函数继承.混合继承: /* js当中的继承 js中 构造函数 原型对象 实力对象的关系: 1 构造函数.prototype = 原型对象 2 ...
- 深入浅出javascript(十二)继承——构造函数继承和组合继承
#题记: 有一水果类,抽象出属性包括:name(水果品种),price(价格),id(ID号).现有两个子类,分别为苹果,桔子,希望继承水果父类. 一.构造函数继承 构造函数继承相当把父类的属性在子类 ...
随机推荐
- 数论 CF230B T-primes
CF230B T-primes 我们知道质数是只有两个不同的正数因数的正整数.相似的,我们把一个正整数 t 叫做 T质数,如果 t 恰好有三个不同的正整数因数. 你被给了一个含有 n 个正整数的数组. ...
- js中的类和对象以及自定义对象
js中的类 1.类的声明 function Person(name,age){ this.name=name; this.age=age; this.test=function(a){ alert(a ...
- 条目二十三《考虑用排序的vector替代关联容器》
条目二十三<考虑用排序的vector替代关联容器> 在看到这个条目的标题的时候,说实话,我一下子是比较懵逼的.这个结论怎么和数据结构的时间复杂度不一致了? 一般来说,像map,set等关联 ...
- MAC系统从零开始
刚从ubuntu转过来,使用mac多有不习惯的地方,下面记录一些使用中遇到的问题,与解决方法. 1.关于应用程序菜单 在mac中的应用程序菜单,不是在应用程序自身,而是在桌面的桌面的顶部栏上,这个栏会 ...
- Angular material mat-icon 资源参考_Toggle
ul,li>ol { margin-bottom: 0 } dt { font-weight: 700 } dd { margin: 0 1.5em 1.5em } img { height: ...
- tomcat下各个文件夹的作用
1.bin目录:这个文件夹包含的是启动/关闭tomcat的脚本,里面有startup.sh(Linux环境下启动tomcat脚本)和startup.bat(Windows环境下启动tomcat脚本), ...
- 分享一下Ubuntu好用的源
vim /etc/apt/sources.list 然后用G跳转到最后一行,然后[ESC]切换到命令行模式,然后键入[o](表示在当前行后插入).也可以多插入几个空行.这样可以有条理的和系统默认的区分 ...
- 单臂vlan路由实现过程
单臂路由拓扑图如下: 实现步骤如下: 1)pc的ip自己配置. 2)在交换机的各个端上划分好vlan 下联口:vlan 10 port g1/0/2 vlan 20 port g1/0/3 ...
- 解决Maven本地仓库没有Jar包问题,请求中央仓库自动下载以及手动下载方法
一.首先指定本地仓库 <localRepository>D:\software\Maven_Home\mvn_repository</localRepository> 二.修改 ...
- zero-copy总结
基本概念 零拷贝,通常在java NIO编程中会使用,比如netty网络工具包. 其真实意思是: 网卡或者其他外设进行io操作时不经过CPU, 而是直接和主memory交互,不经过CPU寄存器,这样可 ...