3 寄生式继承

  1. 组合继承存在调用两次父类构造的问题
  2. 原型继承存在不能实例化对象不能传参的问题
  3. 组合继承和原型继承都存在子类原有原型属性被覆盖的问题
  4. 因此推荐使用寄生式继承
 /*
寄生式继承:
1 解决子类原型对象属性被覆盖的问题:
设置F.property接收父类原型属性,将子类原型属性复制到F.property
再将复制了子类原型属性的F.peoperty设置给子类原型完成属性的覆盖
2 解决调用父类构造问题:
将父类当成属性设置到子类的原型上,子类实例对象就可以在原型链上找到父类构造函数,
子类可以通过this调用自身方法实现实例化,不通过调用外面父类的构造函数传参
这样即实现了功能,又避免了组合继承调用父类构造次数过多和原型继承实例化无法通过构造传参的问题
*/
function Box(_r) {
//设置Box类实例化对象的属性
this.r = _r;
console.log("constructor run");
}
Box.a = 3;
Box.run = function () {
console.log(Box.a);
}
Box.prototype = {
b: 10,
play: function () { }
} function Ball(_r) {
this.supClass.apply(this, arguments);
}
Ball.prototype.walk = function () {
console.log("walk");
}
extend(Ball, Box);
Ball.prototype.play = function () {
this.supClass.prototype.play.apply(this.arguments);
console.log("finish method");
}
var b = new Ball(10);//print constructor run
b.play(); // print finish method
console.log(b); function extend(subClass, supClass) {
function F() { }
//将子类原型属性覆盖掉父类原型相同的属性,再设置给子类
F.prototype = supClass.prototype;
//复制原来原型下的内容
if (Object.assign) {
//Objec.asssign不兼容IE
Object.assign(F.prototype, subClass.prototype);
} else {
if (Object.getOwnPropertyNames) {
var names = Object.getOwnPropertyNames(subClass.prototype);
for (var i = 0; i < names.length; i++) {
Object.defineProperty(F.prototype, name[i], Object.getOwnPropertyDescriptor(names[i]));
}
}
else {
for (var prop in subClass.prototype) {
F.prototype[prop] = subClass.prototype[prop];
}
}
}
//完成属性覆盖
subClass.prototype = new F();
//将子类构造设置为自身,不调用外面父类的构造
subClass.prototype.constructor = subClass;
//父类设置到子类原型上去以供this调用
subClass.prototype.supClass = supClass;
if (supClass.prototype.constructor === Object) {
supClass.prototype.constructor = supClass;
}
}

执行结果:

ES5 寄生式继承的更多相关文章

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

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

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

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

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

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

  4. JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

    说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ...

  5. Javascript继承5:如虎添翼----寄生式继承

    /* * 寄生式继承 * 其实就是对原型继承的第二次封装,在封装过程中对继承的对象进行了扩展. * 也存在原型继承的缺点!! * 这种思想的作用也是为了寄生组合式继承模式的实现. */ //声明基对象 ...

  6. JavaScript之面向对象学九(原型式继承和寄生式继承)

    一.原型式继承 该继承模式是由道格拉斯*克罗克福德在2006年提出的实现继承的方法. 模式的基本思路:借助原型可以基于已有的对象创建新的对象,同时还不必因此创建自定义类型. 代码如下: functio ...

  7. JavaScript各种继承方式(五):寄生式继承(parasitic)

    一 原理 与原型式继承完全相同,只是对父类的实例(也当作子类的实例使用)进行了增强. function create(obj){ let mango = Object.create(obj); man ...

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

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

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

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

随机推荐

  1. 推荐7个GitHub项目

    CS-Notes https://github.com/CyC2018/CS-Notes 技术面试必备基础知识.Leetcode.计算机操作系统.计算机网络.系统设计.Java.Python.C++. ...

  2. FC-NVMe阅读摘要(一)

    首字母缩写 IU Information Unit BLS Basic Link Service ELS Extended Link Service PLOGI N_Port Login PRLI   ...

  3. ansible笔记(14):循环(一)

    在使用ansible的过程中,我们经常需要处理一些返回信息,而这些返回信息中,通常可能不是单独的一条返回信息,而是一个信息列表,如果我们想要循环的处理信息列表中的每一条信息,我们该怎么办呢?这样空口白 ...

  4. numpy 生成数组

    可以看这个博客 https://www.cnblogs.com/td15980891505/p/6082858.html import numpy as np 建立数组并初始化数组 np.zeros( ...

  5. liunx 中设置zookeeper 自启动(service zookeeper does not support chkconfig)

    在liunx 上设置zookeeper 自启动 1.进入目录 cd /etc/init.d 2.创建一个文件 vim zookeeper 3.编辑zookeepr 文件 连接liunx使用的软件是fi ...

  6. detach() 使用和.detach()和.data的区别 、cpu()函数的作用

    detach() 使用和.detach()和.data的区别 .cpu()函数的作用 待办 detach使用 https://blog.csdn.net/qq_27825451/article/det ...

  7. [CF]Round513

    A Phone Numbers 题意:定义"电话号码"为开头为'8',长度为11的字符串.给定一些字符,每个字符只能用一次,求可以拼出多少个电话号码(可以重复). 直接min(st ...

  8. java Map 迭代key,value 最简洁的方法

    import java.util.HashMap; import java.util.Map; public class EntrySets { public static void main(Str ...

  9. IntelliJ IDEA 2017.3尚硅谷-----代码水平垂直

    选择项目——右键

  10. java i++与++i的区别

    i++是先赋值,然后再自+1:++i是先自+1,后赋值. 用代码表示就是: 若 a = i++; 则等价于 a=i;i=i+1; 而 a = ++i; 则等价于 i=i+1;a=i; 例子: int ...