Javascript继承通常有三种方式。

第一种:组合式继承:

  1. function SuperType(name) {
  2. this.name = name;
  3. this.colors = ["red", "blue", "green"];
  4. }
  5. SuperType.prototype.sayName = function() {
  6. console.log(this.name);
  7. };
  8. function SubType(name, age) {
  9. //通过call()调用SuperType的构造函数,继承SuperType属性
  10. SuperType.call(this, name); //第二次调用 SuperType()
  11. this.age = age;
  12. }
  13. SubType.prototype = new SuperType(); //第一次调用
  14. SubType.prototype.sayAge = function() {
  15. console.log(this.age);
  16. };
  17. var instancel = new SubType("Nicholas", );
  18. SuperType()

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

第二种:原型链继承

  1. //原型式继承实例代码:
  2. function createObj(o) {//对传入的对象执行了一次浅复制
  3. function F() {}
  4. F.prototype = o;
  5. return new F();
  6. }
  7. var person = {
  8. name: "Tom",
  9. friends: ["one", "two", "van"]
  10. };
  11. var huPs = createObj(person);
  12. huPs.name = "GRE";
  13. huPs.friends.push("Rob");
  14.  
  15. var yePs = createObj(person);
  16. yePs.name = "Lin";
  17. yePs.friends.push("Sari");
  18.  
  19. console.log(person.friends);//"one,two,van,Rob,Sari"

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

第三种:寄生式继承

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

该继承技术是最常用的。

  1. function inheritPrototype(subType, superType) {
  2. var prototype = object(superType.prototype); //创建对象 超类型原型副本
  3. prototype.constructor = subType; //增强对象 为副本增添construct属性
  4. subType.prototype = prototype; //指定对象
  5. }
  6. function SuperType(name) {
  7. this.name = name;
  8. this.colors = ["red", "blue", "green"];
  9. }
  10. SuperType.prototype.sayName = function() {
  11. console.log(this.name);
  12. };
  13. function SubType(name, age) {
  14. SuperType.call(this, name);
  15. this.age = age;
  16. }
  17. inheritPrototype(SubType, SuperType);
  18. SubType.prototype.sayAge = function() {
  19. console.log(this.age);
  20. };

 该文章参考自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. leetcode - valid number 正则表达式解法

    import java.util.regex.Pattern; public class Solution { Pattern p = Pattern.compile("^[\\+\\-]? ...

  2. Monkey测试结果分析

    Monkey测试结果分析 什么是monkey Monkey 测试是 Android 自动化测试的手段之一,它通过模拟用户的按键输入.触摸屏输入等,测试设备多长时间出现异常.Monkey 是一个命令行工 ...

  3. Layui++>>ajax传递数组,防止深度序列化

  4. 只要一行代码求一串字符中某字符(串)出现次数,c#

    这里只要一行代码就行. static void Main(string[] args) { string str = "qwerwqr;sfdsfds;fdfdsf;dfsdfsdf;dsf ...

  5. mac上terminal_问题_1117

    (1)安装Homebrew /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install ...

  6. 使用python访问网络上的数据

    这两天看完了Course上面的: 使用 Python 访问网络数据 https://www.coursera.org/learn/python-network-data/ 写了一些作业,完成了一些作业 ...

  7. [转] Snapshotting with libvirt for qcow2 images

    http://kashyapc.com/2011/10/04/snapshotting-with-libvirt-for-qcow2-images/ Libvirt 0.9.6 was recentl ...

  8. ASP.NET Core 微服务初探[2]:熔断降级之Polly

    当我们从单体架构迁移到微服务模式时,其中一个比较大的变化就是模块(业务,服务等)间的调用方式.在以前,一个业务流程的执行在一个进程中就完成了,但是在微服务模式下可能会分散到2到10个,甚至更多的机器( ...

  9. Java并发编程基础——同步

    一.synchronized 关键字 1)synchronized 锁什么?锁对象.可能锁对象包括: this, 临界资源对象,Class 类对象.如同下面例子所示: package cn.test. ...

  10. Android开发 - 掌握ConstraintLayout(七)辅助线(Guideline)

    了解过UI设计的同学都知道,在设计的时候,我们经常在界面上拖进一些辅助线来帮我们对齐UI元素,或者方便我们统一的页边距. 在ConstraintLayout的编辑器中,同样也支持这样的功能,我们可以创 ...