Javascript继承通常有三种方式。

第一种:组合式继承:

    function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
console.log(this.name);
};
function SubType(name, age) {
//通过call()调用SuperType的构造函数,继承SuperType属性
SuperType.call(this, name); //第二次调用 SuperType()
this.age = age;
}
SubType.prototype = new SuperType(); //第一次调用
SubType.prototype.sayAge = function() {
console.log(this.age);
};
var instancel = new SubType("Nicholas", );
SuperType()

该继承通过构造函数继承原型链的方法和父类的属性,但该方法会有两次调用父类,第一次是在继承原型链,第二次在继承属性。

第二种:原型链继承

//原型式继承实例代码:
function createObj(o) {//对传入的对象执行了一次浅复制
function F() {}
F.prototype = o;
return new F();
}
var person = {
name: "Tom",
friends: ["one", "two", "van"]
};
var huPs = createObj(person);
huPs.name = "GRE";
huPs.friends.push("Rob"); var yePs = createObj(person);
yePs.name = "Lin";
yePs.friends.push("Sari"); console.log(person.friends);//"one,two,van,Rob,Sari"

这个没什么,Js的原型继承特性。

第三种:寄生式继承

在第一种的方法上,我们在第一次调用父类,也就是继承原型的时候,实际上只需要父类的原型副本,那么取得副本,也就省去了这一次调用。

该继承技术是最常用的。

function inheritPrototype(subType, superType) {
var prototype = object(superType.prototype); //创建对象 超类型原型副本
prototype.constructor = subType; //增强对象 为副本增添construct属性
subType.prototype = prototype; //指定对象
}
function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
console.log(this.name);
};
function SubType(name, age) {
SuperType.call(this, name);
this.age = age;
}
inheritPrototype(SubType, SuperType);
SubType.prototype.sayAge = function() {
console.log(this.age);
};

 该文章参考自https://my.oschina.net/quidditch/blog/307551

Javascript 组合继承 原型链继承 寄生继承的更多相关文章

  1. 对Javascript 类、原型链、继承的理解

    一.序言   和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承 ...

  2. js 继承 原型链

    这里先说基于原型链实现的继承.那首先就得明白什么是原型链了: 每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针. 那么,假如我们让原型对象等于 ...

  3. 图解JavaScript中的原型链

    转自:http://www.jianshu.com/p/a81692ad5b5d typeof obj 和 obj instanceof Type 在JavaScript中,我们经常用typeof o ...

  4. 一篇文章理解JS继承——原型链/构造函数/组合/原型式/寄生式/寄生组合/Class extends

    说实在话,以前我只需要知道"寄生组合继承"是最好的,有个祖传代码模版用就行.最近因为一些事情,几个星期以来一直心心念念想整理出来.本文以<JavaScript高级程序设计&g ...

  5. JavaScript系列--浅析原型链与继承

    一.前言 继承是面向对象(OOP)语言中的一个最为人津津乐道的概念.许多面对对象(OOP)语言都支持两种继承方式::接口继承 和 实现继承 . 接口继承只继承方法签名,而实现继承则继承实际的方法.由于 ...

  6. [js高手之路]从原型链开始图解继承到组合继承的产生

    基于javascript原型链的层层递进查找规则,以及原型对象(prototype)的共享特性,实现继承是非常简单的事情 一.把父类的实例对象赋给子类的原型对象(prototype),可以实现继承 f ...

  7. javascript继承--原型链的 继承

    作者的话:原型链是JavaScript中相当重要的一个知识点,这里我使用了函数结构图,来帮助我更好的理解 /* 原型链继承方式: 通过改变一个对象的原型对象的指向来继承另一个对象 原理: 我们知道,一 ...

  8. JavaScript中的原型链和继承

    理解原型链 在 JavaScript 的世界中,函数是一等公民. 上面这句话在很多地方都看到过.用我自己的话来理解就是:函数既当爹又当妈."当爹"是因为我们用函数去处理各种&quo ...

  9. javascript精髓篇之原型链维护和继承.

    一.两个原型 很多人都知道javascript是原型继承,每个构造函数都有一个prototype成员,通过它就可以把javascript的继承演义的美轮美奂了. 其实啊,光靠这一个属性是无法完成jav ...

随机推荐

  1. 基于jmeter的性能测试平台(二) 一个构想

    之前基于jmeter搭好了分布式测试平台,但是感觉还是很粗糙,打算给它穿点衣服. 整个架构差不多就像下面这个图. (1)基于python django做一个web页面,友好地管理测试过程 (2)con ...

  2. cv2.cvtColor Unsupported depth of input image

    源代码 import cv2 import numpy as ny img = ny.zeros( ( 3 , 3 )) img=cv2.cvtColor(img,cv2.COLOR_BGR2RGB) ...

  3. idea 2017破解的三种方式

    1.该方法最为简便,但是该方法只可以在联网时使用,打开idea主页,找到最后面的Help,打开,找到register-license server, 在输入http://idea.iteblog.co ...

  4. jQuery-弹幕

    该方法可能有bug,毕竟简单粗暴 <!DOCTYPE html><html> <head> <meta charset="UTF-8"&g ...

  5. Hbase的常见shell操作

    1.带namespace的:https://blog.csdn.net/opensure/article/details/46470969 2.http://www.cnblogs.com/xing9 ...

  6. Asp.net Identity框架

    Identity提供基于用户和角色的membership管理框架,基本上可以满足业务项目登录操作的所有功能需求. 如果要使用这套框架需要新建User和Role类型分别继承自IUser<TKey& ...

  7. Azure Sphere–“Object reference not set to an instance of an object” 解决办法

    在开发Azure Sphere应用时,如果出现项目无法编译,出现“Object reference not set to an instance of an object”时,必须从下面两个方面进行检 ...

  8. Java开发瓶颈,Dubbo架构学习整理

    作者:butterfly100 一. Dubbo诞生背景 随着互联网的发展和网站规模的扩大,系统架构也从单点的垂直结构往分布式服务架构演进,如下图所示: 单一应用架构:一个应用部署所有功能,此时简化C ...

  9. 脑残式网络编程入门(二):我们在读写Socket时,究竟在读写什么?

    1.引言 本文接上篇<脑残式网络编程入门(一):跟着动画来学TCP三次握手和四次挥手>,继续脑残式的网络编程知识学习 ^_^. 套接字socket是大多数程序员都非常熟悉的概念,它是计算机 ...

  10. Javascript高级编程学习笔记(43)—— 动态脚本

    动态脚本 大多数情况下,DOM操作都很简洁明了 因为DOM主要就是用来操作页面中的可视节点的 但有些时候我们又希望可以动态的来进行DOM操作 其中的一部分也就是今天我们的内容动态脚本 动态脚本是什么意 ...