一、混合/组合继承的不足

  上一篇JS继承终于混合继承,认真思考一下,发现其还是有不足之处的:

空间上的冗余:在使用原型链的方法继承父类的原型属性(Animal.prototype)的同时,也在子类的原型(Person.prototype)中继承多了一份父类属性(Animal.property);具体来说:p与p.prototype中都保存了type,children,而p.prototype这一份是冗余的;

二、寄生式组合继承

  为了解决上面的问题,所以需要在混合继承的基础上进行改造。那么如何避免冗余呢?

  • 避免使用 Person.prototype = new Animal() 来继承整个Animal实例;
  • 这样将代码改写为 Person.prototype = Animal.prototype
  • 那么又会引入一个问题,Person.prototype与Animal.prototype共用一个空间(在正常继承中,Person.prototype应该有自己独立的空间),也就是说一旦我们修改了Person.prototype,同时也修改了Animal.prototype;
  • 所以继续修改代码为 Person.prototype=Object.create(Animal.prototype)
    下图为Object.create的实现(在支持ES5的浏览器中可以直接使用);
    最后一句修改为:return new F();
    函数中返回的F即为Person.prototype的独立空间
  • 完美主义者,constructor的指向问题(改不改都不影响):原来返回的F.constructor指向Animal,要修改为指向Person;

js继承精益求精之寄生式组合继承的更多相关文章

  1. JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)

    JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...

  2. JavaScript ----------------- 寄生式继承

    寄生式继承 寄生式继承是于原型式继承紧密相关的一种思路.寄生式基础的思路与寄生构造函数和工厂模式类似,既创建一个仅用于封装继承过程的函数,该函数内部以某种方式来增强对象,最后再像真地是它做了所有工作一 ...

  3. js的面向对象的程序设计之理解继承

    来自<javascript高级程序设计 第三版:作者Nicholas C. Zakas>的学习笔记(六) 先来解析下标题——对象和继承~ 一.对象篇 ECMA-262把对象的定义为:&qu ...

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

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

  5. js组合继承和寄生组合式继承比较

    本文是原创文章,如需转载,请注明文章出处 1.js中实现组合继承(B继承A): function A(name){ this.name = name; this.ary = ["AA&quo ...

  6. [js高手之路]设计模式系列课程-组合模式+寄生组合继承实战新闻列表

    所谓组合模式,就是把一堆结构分解出来,组成在一起,现实中很多这样的例子,如: 1.肯德基套餐就是一种组合模式, 比如鸡腿堡套餐,一般是是由一个鸡腿堡,一包薯条,一杯可乐等组成的 2.组装的台式机同理, ...

  7. 三张图搞懂JavaScript的原型对象与原型链 / js继承,各种继承的优缺点(原型链继承,组合继承,寄生组合继承)

    摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...

  8. JavaScript ES5类 原型 原型链 组合、原型、寄生式继承

    ES5类 原型  原型链 继承 JavaScript中,原型是相对于构造函数(类)的叫法(或者说概念),原型链是相对于构造函数(类)的实例对象的叫法. 对于JavaScript对象,如果在对象自身上找 ...

  9. [js高手之路]原型式继承与寄生式继承

    一.原型式继承本质其实就是个浅拷贝,以一个对象为模板复制出新的对象 function object( o ){ var G = function(){}; G.prototype = o; retur ...

随机推荐

  1. javascript 函数执行上下文

    在js里,每个函数都有一个执行的上下文,我们可以通过this来访问. 如: 全局函数 function test(){ var local = this; } 我们发现local等于window(do ...

  2. Javascript类型

    Javascript 有两中类型:原始类型和对象类型. 原始类型包括:数字,字符串,布尔值,null和undefined.其余的都是对象类型. 原始类型 数字.Javascript采用IEEE754标 ...

  3. Allegro16.3约束设置 (转载)

    原文地址:http://blog.chinaunix.net/uid-21198646-id-3212383.html 差分对的约束设置 第一步,差分对的设置 差分对的设置有很多方法,下面介绍两种最常 ...

  4. 三天没有写题了,罪过!--Hash Table Start

    (1)Island Perimeter 解题思路: 在矩阵上循环并记录岛(1)的个数;如果当前节点是岛,则检查其是否具有任何右邻居或下邻居,有的话邻居计数加1 ;岛的周长结果为islands * 4 ...

  5. ios 学习总结之动画(转)

    转自:http://blog.sina.com.cn/s/blog_a85effc301012wu4.html UIView的,翻转.旋转,偏移,翻页,缩放,取反的动画效果   翻转的动画 //开始动 ...

  6. Android菜鸟成长记5-ADB和sqllite

    Android开发环境中,ADB是我们进行Android开发经常要用的调试工具,它的使用当然是我们Android开发者必须要掌握的. ADB概述 Android Debug Bridge,Androi ...

  7. if条件里比较浮点数

    晚上看会儿书,基础的东西,很多都不熟练,不得不佩服那些人真的很厉害,为啥会想到那些,我这傻脑袋是想不到,暂时...... 比较3.3333与3 #!/bin/bash var1=`echo " ...

  8. hibernate执行session.createQuery(hql)时hql若有参数则报错

    项目从Jboss换位Tomcat服务器,打开如下Hql都报错: SELECT COUNT(*) FROM SystemUser WHERE STATUS != -1 解决方法:在Lib中加入antlr ...

  9. java io学习之File类

    1.先看下四个静态变量 static String pathSeparator The system-dependent path-separator character, represented a ...

  10. PHP 数组函数整理

    如果你已经使用了一段时间PHP的话,那么,你应该已经对它的数组比较熟悉了——这种数据结构允许你在单个变量中存储多个值,并且可以把它们作为一个集合进行操作. 经常,开发人员发现在PHP中使用这种数据结构 ...