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

js实现继承

js实现继承 经典继承(原型链) 缺点:过多的继承了没用的属性 Grandfather.prototype.lastName = 'zhang' function Grandfather() {...father function Son() { this.hobby = 'game' } var son = new Son() console.log(son); ​ son只想要继承...grandfather的lastName属性,但是由于原型链的关系,造成了son既会继承grandfather自神的东西,grandfather的原型的东西,father自身的东西和father原型上的东西...,造成了不必要的继承 共享原型 本质:重写原型对象 优点:只会继承父的原型,不会继承父原本自带的属性或方法(只有调用new Father()才会继承自身的东西) 缺点:给本身的原型添加属性或方法时,会把继承的那个原型也修改了...) 雏形 本质:重写原型对象 优点:只会继承父的原型,不会继承父原本自带的属性或方法(只有调用new Father()才会继承自身的东西) 缺点:1,这样继承后即使修改了son的原型也不会修改father

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

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

    继承的含义: 继承是面向对象编程中的一个重要概念,通过继承可以使子类的实例使用在父类中定义的属性和方法。...二、 构造函数继承 针对前面原型链继承可能会存在公用一个原型链的问题,那么我们可以给大家介绍一种方式:构造函数的继承。构造函数的继承相当于将父类复制给子类。...复制的处理,相当于在子类中实现了所有父类的方法,影响子类的性能。...三、 组合继承 原型链继承继承父类原型链上的属性,但是可能会存在篡改的问题;而构造函数继承不会存在篡改的问题,但是不能继承原型上面的属性。那么我们是否可以将两者进行结合呢?...并且还能继承原型链上面的方法。这个方法是现在库的实现方法。

    1.8K40

    Js继承实现方式

    Js继承实现方式 继承是面向对象软件技术当中的一个概念,与多态、封装共为面向对象的三个基本特征。继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。...原型链继承 通过将子类的原型对象指向父类的实例,实现继承访问父类属性方法等 // 定义父类 function Parent(){ this.name = "parent"; this.say...,实例是子类的实例,也是父类的实例 子类实例可以继承父类构造函数属性和方法、父类原型属性和方法 不足 无法实现继承 子类实例化时无法向父类的构造函数传参 所有子类实例都会共享父类的原型对象中的属性 构造函数继承...实例是父类的实例,不是子类的实例 同样也是将父类的成员与方法做了实例化拷贝 拷贝继承 通过直接将父类的属性拷贝到子类的原型中实现继承 // 定义父类 function Parent(from){...实例化子类时可以向父类构造函数传参 不足 无法获取父类不可枚举的方法 同样也是将父类的成员与方法做了实例化并拷贝 原型式继承 通过共享原型对象实现继承 // 定义父类 function Parent(

    2K20

    js实现继承的几种方式

    js作为一个面向对象的弱类型语言,继承也是其非常强大的特性之一。一般情况下会出现下面的6中继承方式。...既然要实现继承,首先应该得有一个父类: // 定义一个动物类 function Animal (name) { // 属性 this.name = name || 'Animal'; //...无法实现继承 来自原型对象的引用属性是所有实例共享的 创建子类实例时,无法向父类构造函数传参 2、构造继承 核心:使用父类的构造函数来增强子类实例,等于是复制父类的实例属性给子类(没用到原型) function...console.log(cat instanceof Cat); // true 特点: 解决了原型继承中,子类实例共享父类引用属性的问题 创建子类实例时,可以向父类传递参数 可以实现继承(call多个父类对象...) 缺点: 实例并不是父类的实例,只是子类的实例 只能继承父类的实例属性和方法,不能继承原型属性/方法 无法实现函数复用,每个子类都有父类实例函数的副本,影响性能 3、实例继承 核心:为父类实例添加新特性

    1.4K20

    JS 继承

    继承的相关问题,比如: ES6 的 class 继承用 ES5 如何实现。...__proto__ = proto; return obj; } nodejs源码就是利用这个实现继承的工具函数的。...知道了ES6 extends继承做了什么操作和设置 __proto__的知识点后,把上面 ES6例子的用 ES5就比较容易实现了,也就是说实现寄生组合式继承,简版代码就是: // ES5 实现ES6...推荐阅读JS继承相关的书籍章节 《JavaScript高级程序设计第3版》第6章——面向对象的程序设计 6种继承的方案,分别是原型链继承、借用构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合式继承...上卷第6章——行为委托和附录A(ES6中的class) 总结 继承对于JS来说就是父类拥有的方法和属性、静态方法等,子类也要拥有。

    2.9K32

    JS实现继承的几种方法总结

    文章目录 一、基本代码 二、实现继承的方法: 1.原型链继承 2.构造继承: 3.实例继承 4.拷贝继承: 5.组合继承: 6.寄生组合继承: 7.class – extends – – ES6 一...原型上面的方法: Animal.prototype.eat = function(food) { console.log(this.name + '正在吃:' + food); } ---- 二、实现继承的方法...,也是父类的实例 父类新增原型方法/原型属性,子类都能访问的到 简单 缺点 要想为子类新增属性和方法,必须要在new Animal()这样的语句之后执行,不能放到构造器中 无法实现继承多个 来自原型对象的所有属性被所有实例共享...console.log(cat instanceof Animal); //false console.log(cat instanceof Cat); //true 特点: 创建子类实例时,可以向父类传递参数 可以实现继承...(call多个父类对象) 缺点: 实例并不是父类的实例,只是子类的实例 只能继承父类的实例属性和方法,不能继承原型属性/方法 无法实现函数复用,每个子类都有父类实例函数的副本,影响性能 ---- 3.实例继承

    1.2K40

    使用Node.js Addon实现继承

    前言:昨天有个同学问怎么通过NAPI把C++类的继承关系映射到JS,很遗憾,NAPI貌似还不支持,但是V8支持,因为V8在头文件里导出了这些API,并Node.js里也依赖这些API,所以可以说是比较稳定的...实现代码分析完了,我们看到把C++类映射到JS的方式有两种,第一种就是两个C++ 类没有继承关系,通过V8的继承API实现两个JS层存在继承关系的类(函数),比如print函数的实现,我们看到子类没有实现...第二种就是两个存在继承关系的C++类,同样先通过V8的API实现两个继承的类导出到JS使用,因为JS层使用的只是壳子,具体执行到C++代码的时候,我们再体现出这种继承关系。...上面代码新建了一个新的函数模板并且设置了一系列的原型属性,那么模板t就继承了这些属性。我们看看Node.js怎么使用的。...后记:在JS实现继承是简单的,但是在底层实现起来还是比较复杂的,但是从代码设计的角度来看是非常有必要的。

    2K30

    JS进阶:继承

    在理解继承之前,需要知道 js 的三个东西: 什么是 JS 原型链 this 的值到底是什么 JS 的new 到底是干什么的 一、什么是 JS 原型链 我们知道 JS 有对象,比如 var obj =...差异化 如果我们想让 obj.toString 和 obj2.toString 的行为不同怎么做呢?...缺点: 只能继承父类的实例属性和方法,不能继承原型属性/方法 无法实现复用,每个子类都有父类实例函数的副本,影响性能 3、组合继承 组合上述两种方法就是组合继承。...用原型链实现对原型属性和方法的继承,用借用构造函数技术来实现实例属性的继承。...无法传递参数 6、寄生组合式继承 结合借用构造函数传递参数和寄生模式实现继承 function inheritPrototype(subType, superType){ var prototype

    4.4K10

    JS面试题-JS实现继承的方法(共6种)

    方法五(推荐使用): 组合继承的优化1(寄生组合式继承) 这种方式的高效率体现它只调用了一次 Parent 构造函数,并且因此避免了在 Child.prototype 上面创建不必要的、多余的属性。...var F = function () {}; F.prototype = Parent.prototype; Child.prototype = new F(); Object.create的底层实现...核心是_inherits函数,可以看到它采用的依然也是第五种方式————寄生组合继承方式,同时证明了这种方式的成功。...不过这里加了一个Object.setPrototypeOf(subClass, superClass),是用来继承父类的静态方法。这也是原来的继承方式疏忽掉的地方。...__proto__ = superClass; } 继承的最大问题在于:无法决定继承哪些属性,所有属性都得继承

    71740

    JS原型继承和类式继承

    类式继承(构造函数) JS中其实是没有类的概念的,所谓的类也是模拟出来的。特别是当我们是用new 关键字的时候,就使得“类”的概念就越像其他语言中的类了。...child.prototype = new father(); var man = new child(); man.a(); 可以看到第七行实现了原型继承。...另外就是类式继承不支持多重继承,而对于原型继承来说,你只需要写好extend对对象进行扩展即可。 组合模式 另外的一种模式,是结合类继承和原型继承的各自优点来进行对父类的继承。...从这里,我们也可以看到类继承和原型基础的一些区别。 结论 原型继承比较符合js这种语言的特点。因为它本身就是js强大的原型的一部分。...而类式继承,与其称它为继承方式,毋宁说是一种函数的运用技巧来模拟继承罢了。本文是卤煮的一己之见,错误偏颇在所难免,如果有之,请各位斧正。

    3.4K90

    JS继承机制总结

    JS继承机制总结 继承就是子类可以使用父类的所有功能,并且对这些功能进行扩展。 JS继承机制主要为原型链继承、构造函数继承、组合继承、寄生继承、寄生组合继承、原型式继承和混合式继承。...,又继承了父类的实例 缺点 无法实现多重继承 创建子类时,无法向父类传参 来自原型对象的所有属性都被共享了,这样如果不小心修改了原型对象中的引用类型属性,那么所有子类创建的实例对象都会受到影响 如果要给子类的原型上新增属性和方法...,实现继承,创建子类实例时,可以向父类传递参数 缺点 只能继承父类实例上的属性与方法,无法继承父类原型上的属性与方法。...实例并不是父类的实例,只是子类的实例(子类相对于深拷贝了父类实例上的属性与方法) 无法实现函数复用,每个子类都有父类实例函数的副本,影响性能 (无法实现函数复用’父类构造函数中的某个函数可能只是一个功能型的函数...console.log(huaihuai) ​ console.log(guaiguai.heart) console.log(huaihuai.colors) 复制代码 优点 在不用创建构造函数的情况下,实现了原型链继承

    1.6K10

    day018: JS如何实现继承继承一定是好的设计吗?​

    第六篇: JS如何实现继承继承一定是好的设计吗?...,它的名字也叫做寄生组合继承。...答案是用来继承父类的静态方法。这也是原来的继承方式疏忽掉的地方。 追问: 面向对象的设计一定是好的设计吗? 不一定。从继承的角度说,这一设计是存在巨大隐患的。...}}class otherCar extends Car{} 现在可以实现车的功能,并且以此去扩展不同的车。 但是问题来了,新能源汽车也是车,但是它并不需要addOil(加油)。...也就是说加油这个方法,我现在是不需要的,但是由于继承的原因,也给到子类了。 继承的最大问题在于:无法决定继承哪些属性,所有属性都得继承

    63910

    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...Animal) // false 组合继承(构造继承+原型链继承) 特点: 1、组合构造继承和原型链继承 优点: 1、可以继承实例属性/方法,也可以继承原型属性/方法 2、既是子类的实例,

    2.2K70

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭
      领券