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号).现有两个子类,分别为苹果,桔子,希望继承水果父类. 一.构造函数继承 构造函数继承相当把父类的属性在子类 ...
随机推荐
- Establishing SSL connection without server's identity verification is not recommended.
完全描述:Establishing SSL connection without server's identity verification is not recommended. Accordin ...
- 网络传输层之TCP/UDP详解
一.运输层协议概述 从通信和信息处理的角度看,运输层向它上面的应用层提供通信服务,它属于面向通信部分的最高层,同时也是用户功能中的最低层. 运输层的任务就是负责主机中两个进程之间的通信,其数据传输的单 ...
- js中奇怪的问题 同步ajax,modal遮罩层
奇怪问题一 今天有一段js执行的时候出现了问题 $.ajax({ ..., async:false, ... }); $('#myModal').modal('hide'); loadcurrentp ...
- Linux进程间通信——使用System V 消息队列
消息队列 消息队列提供了一种从一个进程向另一个进程发送一个数据块的方法. 每个数据块都被认为含有一个类型,接收进程可以独立地接收含有不同类型的数据结构.我们可以通过发送消息来避免命名管道的同步和阻塞问 ...
- Echo团队Alpha冲刺随笔 - 第七天
项目冲刺情况 进展 服务器部署完成.小程序改了几个BUG,WEB端大部分完成,后端主体功能大致完成. 问题 交接的时候出现很多新问题 心得 软工实践真棒!yeah!!! 今日会议内容 黄少勇 今日进展 ...
- [转] 公共DNS,114.114.114.114和8.8.8.8
[From] https://zhidao.baidu.com/question/304558434158495364.html 一.两者的联系 114.114.114.114和8.8.8.8,这两个 ...
- Vue.js 使用注意事项
Vue.js 使用注意事项 1 过滤器主要用于简单的文本转换,如果要实现复杂的数据变换,应使用计算属性 指令的使用 v-bind基本用于HTML元素上的属性,如id.class.href.src等 v ...
- 小米MIX 3获得ROOT权限的步骤
小米MIX 3有没有办法开启Root超级权限?大伙都知道,Android设备有Root超级权限,一旦手机开启root相关权限,可以实现更强大的功能,比如大伙部门的营销部门的妹纸,使用一些营销工具都需要 ...
- DES加密之强制更新下载分离器
数据加密算法(Data Encryption Algorithm,DEA)是一种对称加密算法,很可能是使用最广泛的密钥系统,特别是在保护金融数据的安全中,最初开发的DEA是嵌入硬件中的.通常,自动取款 ...
- Ad Click Prediction: a View from the Trenches (2013)论文阅读
文章链接: https://static.googleusercontent.com/media/research.google.com/zh-CN//pubs/archive/41159.pdf 补 ...