首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

JS实现继承的方式

JS实现继承的方式 构造函数继承 原型继承 组合(构造函数+原型)继承 Class继承 ---- 构造函数继承 构造函数继承的关键:在Child构造函数中执行Parent.call(this)...Child继承 function Child(name, type){ Parent.call(this, name); this.type = type; } 原型继承 原型继承的关键:...组合继承 组合继承的关键: 1.属性使用构造函数继承 - 避免了原型继承中Parent引用属性被所有Child实例共享的缺陷。...Class继承 class继承用extends实现继承 class Person{ constructor(skin,language){ this.skin = skin; this.language...因为子类没有自己的this对象,而是继承父类的this对象。如果不调用super函数,子类就得不到this对象。super()作为父类的构造函数,只能出现在子类的constructor()中。

2.1K20

Js继承的实现方式

Js继承的实现方式 继承是面向对象软件技术当中的一个概念,与多态、封装共为面向对象的三个基本特征。继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。...原型链继承 通过将子类的原型对象指向父类的实例,实现继承访问父类属性方法等 // 定义父类 function Parent(){ this.name = "parent"; this.say...、父类原型属性和方法 不足 无法实现多继承 子类实例化时无法向父类的构造函数传参 所有子类实例都会共享父类的原型对象中的属性 构造函数继承 当子类构造函数被调用时,借助call或者apply调用父类构造方法实现对于...new Child()或直接调用Child() 不足 不支持多继承 实例是父类的实例,不是子类的实例 同样也是将父类的成员与方法做了实例化拷贝 拷贝继承 通过直接将父类的属性拷贝到子类的原型中实现继承...寄生组合继承 通过寄生方式,砍掉父类的实例属性,在调用两次父类的构造的时候,就不会初始化两次实例方法和属性,避免的组合继承的缺点 // 定义父类 function Parent(from){

2K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    js实现继承的几种方式

    js作为一个面向对象的弱类型语言,继承也是其非常强大的特性之一。一般情况下会出现下面的6中继承方式。...无法实现多继承 来自原型对象的引用属性是所有实例共享的 创建子类实例时,无法向父类构造函数传参 2、构造继承 核心:使用父类的构造函数来增强子类实例,等于是复制父类的实例属性给子类(没用到原型) function...console.log(cat.eat("猫粮"));//此处会报错,通过构造继承的方式无法继承原型属性和方法 console.log(cat instanceof Animal); // false...) 缺点: 实例并不是父类的实例,只是子类的实例 只能继承父类的实例属性和方法,不能继承原型属性/方法 无法实现函数复用,每个子类都有父类实例函数的副本,影响性能 3、实例继承 核心:为父类实例添加新特性...) 6、寄生组合继承(推荐) 核心:通过寄生方式,砍掉父类的实例属性,这样,在调用两次父类的构造的时候,就不会初始化两次实例方法/属性,避免的组合继承的缺点 function Cat(name){

    1.4K20

    js各种继承方式汇总

    js中的各种继承实现汇总 首先定义一个父类: function Animal(name) { this.name = name || '动物' this.sleep = function ()...方式) 特点: 1、子类的构造中进行父类构造的调用 优点: 1、实现了多继承,想继承哪个直接在子类构造里面call或者apply哪个就行 2、避免所有子类实例共享父类引用属性问题 3、创建子类实例时...,可以向父类传递参数 缺点: 1、没用到原型,只是单纯继承了父类的实例属性及方法 2、没继承原型上的属性及方法 3、每个子类都有父类方法属性的副本,影响性能,没有实现父类函数复用 function...2、不能实现多继承 function Pig(name) { const instance = new Animal() instance.name = name || '猪' return...(暴力继承) 特点: 1、子类的构造中强制拷贝父类原型上的属性或方法 优点: 1、可以多重继承 缺点: 1、效率较低,内存占用高 2、不能继承父类不可枚举的属性(不能用for in遍历的)

    2.2K70

    js实现继承

    js实现继承 经典继承(原型链) 缺点:过多的继承了没用的属性 Grandfather.prototype.lastName = 'zhang' function Grandfather() {...grandfather的lastName属性,但是由于原型链的关系,造成了son既会继承grandfather自神的东西,grandfather的原型的东西,father自身的东西和father原型上的东西...,造成了不必要的继承 共享原型 本质:重写原型对象 优点:只会继承父的原型,不会继承父原本自带的属性或方法(只有调用new Father()才会继承自身的东西) 缺点:给本身的原型添加属性或方法时,会把继承的那个原型也修改了...) 原理:在函数里面调用函数,约等于将父里面的代码复制粘贴到子里面,然后通过call将父的this改成子的this 缺点: 不能继承借用的构造函数的原型 每次调用子构造函数都要调用多一次借用的父构造函数...) 雏形 本质:重写原型对象 优点:只会继承父的原型,不会继承父原本自带的属性或方法(只有调用new Father()才会继承自身的东西) 缺点:1,这样继承后即使修改了son的原型也不会修改father

    5.3K20

    js 继承的是什么?如何实现继承?

    继承的含义: 继承是面向对象编程中的一个重要概念,通过继承可以使子类的实例使用在父类中定义的属性和方法。...二、 构造函数继承 针对前面原型链继承可能会存在公用一个原型链的问题,那么我们可以给大家介绍一种方式:构造函数的继承。构造函数的继承相当于将父类复制给子类。...复制的处理,相当于在子类中实现了所有父类的方法,影响子类的性能。...六、 寄生组合式继承 前面说了这么多,每种继承方式都有自己的优点和缺点,那么是不是可以将这些继承的方式做一个合并:以他之长补己之短呢?...这个例子的效率的体现在它只调用了一次父类的构造函数,这很大程度上面减少创建了不必要多余的属性。并且还能继承原型链上面的方法。这个方法是现在库的实现方法。

    1.8K40

    JS 原生方法原理探究(四):如何实现继承的几种方式?

    这是JS 原生方法原理探究系列的第四篇文章。本文会介绍如何实现 JS 中常见的几种继承方式,同时简要它们的优缺点。 实现继承的方法 ?...实现继承的方法共有 7 种,这 7 种方法并不是互相独立的,它们之间更像是一种互补或者增强的关系。...,使用构造函数继承的方式去继承属性。...4) 原型式继承 原型式继承所做的事情类似于浅拷贝一个对象,再通过自定义的方式增强新对象。它能够方便地实现在不同对象之间共享信息,同时又不需要额外创建构造函数(内部做了处理)。...假设我们现在有一个父类,然后需要实现一个继承父类的子类。

    1.5K20

    JavaScript实现继承的6种方式

    一、JavaScript 的继承   许多面向对象语言都支持两种继承的方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。...在 JavaScript 中由于函数没有签名也就无法实现接口继承,而只支持实现继承,而且实现继承主要通过原型链来实现的。   ...二、JavaScript实现继承的方式 1、原型链继承 2、构造函数继承 3、组合继承 4、原型式继承 5、寄生式继承 6、寄生组合式继承 1、原型链继承 // 实现原型链的一种基本模式 function...使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。这样,既通过在原型上定义方法实现了函数复用,又能够保证每个实例都有自己的属性。...但是缺点是:包含引用类型值的属性始终都会共享相应的值 5、寄生式继承 // 创建一个仅用于封装继承过程的函数,该函数在内部以某种方式来增强对象,最后返回这个对象 function createPerson

    82410

    JavaScript实现继承的6种方式

    JavaScript 中的继承 继承是面向对象中只要的概念,分为接口继承、实现继承。继承接口其实就是继承方法签名,而实现继承是继承实际的方法。...在JavaScript中因为函数没有签名,所以实现继承是 ES 唯一的继承方式,其主要是基于原型链来实现的。 1....道格拉斯·克罗克福德(Douglas Crockford)在一篇文章中介绍了一种新的继承方式,严格意义上没有构造函数,不适用自定义类型,通过原型实现对象之间的信息共享。...这样结合寄生式继承和组合继承的优点来实现继承的方式叫做寄生式组合继承,算是一种比较完美的方式了!...Father.call(this, name); this.age = age; } // 继承 // Son.prototype = new Father(); // 通过拷贝父类的方式赋值给子类原型来实现继承

    38820

    JS入门难点解析12-继承的实现方式与优缺点

    如果你能好好理解体会这两篇文章中的内容,那么对于本章所述的知识点,你将会感觉清晰易懂。 2. 关于继承 在详细讲述继承前,我们有必要理解继承的概念和JS为什么要实现继承。...下面我们详细介绍实现JS继承的两类四种方式和这几种方式的组合,以及他们各自的优缺点。 3. 模拟类的继承 正如第2节所述,JS的设计者为我们提供了一个最直接的思路。...参考 JS入门难点解析10-创建对象 JS入门难点解析11-构造函数,原型对象,实例对象 javascript面向对象系列第三篇——实现继承的3种形式 一张图理解prototype、proto和constructor...的三角关系 JS实现继承的几种方式 重新理解JS的6种继承方式 Javascript继承机制的设计思想 经典面试题:js继承方式上 经典面试题:js继承方式下 闲说继承 Javascript...中的几种继承方式比较 JS实现继承的几种方式详述(推荐) 百度百科-面向对象程序设计 廖雪峰的官方网站-原型继承 百度百科-javascript 百度百科-继承性 BOOK-《JavaScript

    1.3K40

    JavaScript实现继承的六种方式

    JavaScript 实现继承的六种方式 ---- 父类 function Person(name) { this.name = name; this.say = function () {...缺点: 为子类新增属性和方法,不能在构造函数中 无法实现多继承 创建子类实例时,不能向父类构造函数传参数 所有新实例都会共享父类实例的属性。...原型式继承 为父类实例添加属性、方法,作为子类实例。 道格拉斯·克罗克福德在一篇文章中介绍了一种实现继承的方法,这种方法并没有使用严格意义上的构造函数。...---- es6 之前没有 Object.create()方法,可以自己实现(实际就是原型式继承的关键函数) 关键: 接受一个对象 obj 返回一个新对象 newObj 让 newObj....return new F(); // 返回新的函数对象 } ---- 参考链接: js 继承的几种方式 - 知乎 (zhihu.com) js 继承的 6 种方式 - ranyonsue -

    54840

    javascript 面向对象(实现继承的几种方式)

    (继承到了当前对象的原型中)   console.log(result.getAge()); //22   //调用了从Parent原型中扩展来的方法 2、构造继承 基本思想 借用构造函数的基本思想就是利用...核心:使用父类的构造函数来增强子类实例,等于是复制父类的实例属性给子类(没用到原型) 缺点: 方法都在构造函数中定义, 只能继承父类的实例属性和方法,不能继承原型属性/方法,无法实现函数复用,每个子类都有父类实例函数的副本...3、组合继承 组合继承(所有的实例都能拥有自己的属性,并且可以使用相同的方法,组合继承避免了原型链和借用构造函数的缺陷,结合了两个的优点,是最常用的继承方式) 核心:通过调用父类构造,继承父类的属性并保留传参的优点...,然后再通过将父类实例作为子类原型,实现函数复用 缺点:调用了两次父类构造函数,生成了两份实例(子类实例将子类原型上的那份屏蔽了) function Person (name) {...'小红'] 4、寄生组合继承 核心:通过寄生方式,砍掉父类的实例属性,这样,在调用两次父类的构造的时候,就不会初始化两次实例方法/属性,避免的组合继承的缺点 缺点:堪称完美,但实现较为复杂

    69180
    领券