js中7种继承的实现和优缺点

原型链继承

function Parent(){this.name = 'kevin'
}Parent.prototype.getName = function(){console.log(this.name)
}function Child(){}
Child.prototype = new Parent()var child = new Child()
console.log(child.name) //kevin

  

优点:

  1. 简单,容易实现

缺点:

  1. 来自父类原型对象的引用属性是所有子类实例共享的
  2. 创建子类实例时,无法向父类构造函数传参

借用构造函数(经典继承)

function Parent(name){this.name = name
}function Child(name){Parent.call(this,name)
}let child = new Child('Tom')
let child1 = new Child('Jack')
console.log(child.name) //Tom
console.log(child1.name) //Jack

  

优点:

  1. 解决了子类型实例共享父类引用属性的问题
  2. 创建子类实例时,可以向父类构造函数传参

缺点:

  1. 无法实现函数复用 ,方法在构造函数中定义,每次创建子类实例都会创建一个新方法,占用内存

组合继承(原型链继承和经典继承的双剑合璧)

function Parent(name){this.name = namethis.color = ['red','bule','green']
}Parent.prototype.getName = function(){console.log(this,name)
}function Child(name,age){this.age = ageParent.call(this,name)
}Child.prototype = new Parent()
Child.prototype.constructor = Child
Child.prototype.getAge = function(){console.log(this.age)
}let child = new Child('Tom',12)
console.log(child.name) //Tom
child.getAge()  //12
child.color.push('blcak')
console.log(child.color) //['red','bule','green','black']let child1 = new Child('Jack',18)
console.log(child1.name) //Jack
child1.getAge()  //18
console.log(child1.color) //['red','bule','green']

  

优点:

  1. 不存在父类引用属性共享问题
  2. 可以给父类构造函数传参
  3. 通过原型属性设置方法,使得函数可复用
  4. 最常用的继承方式

缺点(小瑕疵):

  1. 子类调用了两次父类构造函数,生成了两个父类实例,第二次调用改变了指向第一个实例的指针,使得第一个实例变得多余了

原型式继承

function object(o){ function F(){}F.prototype = oreturn new F()
}//在ES5中有了新方法代替Object.created(o,{name:'Ton'等新属性})let person = {name:'Tom',color : ['red','bule','green']
}let person1 = Object.create(person)
let person2 = Object.create(person)person1.name = 'Jack'
person1.color.push('black')
person2.name = 'Kevin'
person1.color.push('yellow')console.log(person1.name)   //Jack
console.log(person2.name)   //Kevin
console.log(person1.color == person2.color)  //true

  

优点:

  1. 从已有对象衍生新对象,不需要创建自定义类型,更像是对象复制

缺点:

  1. 原型引用的属性被实例所共享
  2. 无法实现代码复用

寄生式继承

let person = {name:'Tom',color : ['red','bule','green']
}function createAnother(o){ let clone = create(o)clone.getName(){console.log(this.name)}return clone    //clone这个对象不仅有原型引用属性,还有自己的方法
}let person1 = createAnother(person)
person1.getName() //Tom 

  

优点:

  1. 不需要创建自定义类型

缺点:

  1. 原型引用的属性被实例所共享
  2. 无法实现代码复用

##寄生组合式继承(最佳方式)

function Parent (name) {this.name = name;this.colors = ['red', 'blue', 'green'];
}Parent.prototype.getName = function () {console.log(this.name)
}function Child (name, age) {Parent.call(this, name);this.age = age;
}function prototype(Child,Parent){ //获得父类型原型上的方法let prototype = object(Parent.prototype) //创建父类型原型的一个副本,相当于prototype.__proto__ = Parent.prototypeprototype.constructor = ChildChild.prototype = prototype
}prototype(Child,Parent) //必须执行这个函数,才能进行给子类型原型写方法,顺序调转的话子类型原型会被重写
Child.prototype.getName = function(){console.log(this.name)
}

  

优点:完美 缺点:用起来麻烦

class继承

class Parent {constructor(name,age){this.name = namethis.age = age}showName(){console.log(this.name);}
}class Child extends Parent{constructor(name,age,sex){super(name,age)this.sex = sex}showSex(){console.log(this.sex);}
}
let parent = new Parent('Jack',30)
console.log(parent.name,parent.age);
let child = new Child('Tom',12,'男')
console.log(child.name,child.age);
child.showName() //Tom
child.showSex() //男

  

 

转载于:https://www.cnblogs.com/Gzzzh/p/10526149.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/363488.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

u8系统怎么连接服务器,用友U8 怎么连接远程服务器

用友U8 怎么连接远程服务器 内容精选换一换配置应用系统的跨云热备容灾方案如图1所示。在如图1所示的方案中,用户的生产数据中心的应用系统使用MySQL作为数据库,应用系统与MySQL均热备容灾到华为云上。用户的生产数据中心与华为云之间使用专线进行网络连…

使用Java 8 Streams进行编程对算法性能的影响

多年来,使用Java进行多范例编程已经成为可能,它支持面向服务,面向对象和面向方面的编程的混合。 带有lambda和java.util.stream.Stream类的Java 8是个好消息,因为它使我们可以将功能性编程范例添加到混合中。 确实,lam…

bind搭建(二)反向解析

我们在上一节已经知道了怎么建立DNS的服务器端,可以实现了域名到IP之间的转换。那么好我们现在就来了解一下如何实现反向的DNS解析,也就是IP到域名的映射。 步骤如下: l 在/etc/named中声明反向区域 l 在/var/named/chroot/var/named/中创建…

js求渐升数的第100位

我弟考了道数学竞赛题,问我能不能用代码算结果.. 题目是这样的 用 1、2、3、4、5 组合数字,然后排列大小,从小到大,求排在第100位的数值大小 function foo(chars) {var count 0;if (!chars.length) return;var _foo function(c…

[导入]商业智能2.0?(BI 2.0 from Timo Elliott)

译者注: 关于BI2.0的说法很多,不尽一致,目的只是想多了解一些;译文并不代表译者认可原文观点,只是顺便译了以方便不喜欢E文的朋友。本文是一篇充满探讨及疑问的文章,来自Timo Elliott(Business Objects历史上的第8号员…

poj 3259 Wormholes : spfa 双端队列优化 判负环 O(k*E)

1 /**2 problem: http://poj.org/problem?id32593 spfa判负环&#xff1a;4 当有个点被松弛了n次&#xff0c;则这个点必定为负环中的一个点&#xff08;n为点的个数&#xff09;5 spfa双端队列优化&#xff1a;6 维护队列使其dist小的点优先处理7 **/8 #include<stdio.h&g…

编写干净的测试–用特定领域的语言替换断言

很难为干净的代码找到一个好的定义&#xff0c;因为我们每个人都有自己的单词clean的定义。 但是&#xff0c;有一个似乎是通用的定义&#xff1a; 干净的代码易于阅读。 这可能会让您感到有些惊讶&#xff0c;但是我认为该定义也适用于测试代码。 使测试尽可能具有可读性是我…

如何让MFC程序关闭按钮失效,也无法右击任务栏关闭窗口来关闭?

如何让MFC程序关闭按钮失效&#xff0c;也无法右击任务栏关闭窗口来关闭&#xff0c;即右键任务栏的关闭窗口失效呢&#xff1f;很简单&#xff0c;有一个小窍门就是&#xff1a;响应IDCANCEL消息&#xff0c;具体实现如下&#xff1a; 首先定义消息映射&#xff1a;ON_BN_CLIC…

令人眼睛一亮的履历表

令人眼睛一亮的履历表 你辛辛苦苦写的一份简历&#xff0c;可在人事经理眼里最多只是停留几十秒的时间。如果时机拿捏不好&#xff0c;它会给你造成麻烦&#xff1a;它可能暴露你的短处&#xff0c;而且基本目的都是供人淘汰之用。然而&#xff0c;当你必须做出履历表时&#…

angularjs封装bootstrap官网的时间插件datetimepicker

背景:angular与jquery类库的协作 第三方类库中&#xff0c;不得不提的是大名鼎鼎的jquery,现在基本上已经是国内web开发的必修工具了。它灵活的dom操作&#xff0c;让很多web开发人员欲罢不能。再加上已经很成熟的jquery UI 库和大量jquery 插件&#xff0c;几乎是一个取之不尽…

Java中的得墨meter耳定律–最少知识原理–实际示例

得墨meter耳定律&#xff08;也称为最少知识定律&#xff09;是一种编码原理&#xff0c;它表示模块不应该知道其操作的对象的内部细节。 如果代码依赖于特定对象的内部细节&#xff0c;则很有可能一旦该对象的内部发生更改&#xff0c;它就会被破坏。 由于封装是关于隐藏对象的…

课后作业1

自我介绍 我叫张阔&#xff0c;我的爱好是旅行&#xff0c;游览世界的美好风光&#xff1b; 我的码云个人主页是&#xff1a;https://gitee.com/ZkTt0428&#xff1b; 我的第一个项目地址是&#xff1a;https://gitee.com/ZkTt0428/Frist&#xff1b; 目前代码量有10000行了&am…

记录6月28日的体验,自己现实的感触

2016年6月28日&#xff0c;是我自己要求的要去湖北的日子&#xff0c;可是现在&#xff0c;这个只能成为过去式&#xff0c;只能是提一提&#xff01; 2016年5月17日&#xff0c;我在想&#xff0c;我要通宵加班&#xff0c;做好自己最好&#xff0c;最期待完成的3.0&#xff0…

lucene索引

1。lucene的索引尽量不要频繁而小量的编制&#xff0c;比如&#xff1a;用户每发一个贴子&#xff0c;就加入索引&#xff0c;那样对索引的结构和效率不利。 可以采用定时或者定量&#xff0c;批量处理索引的方式。 2。在批量处理的基础上&#xff0c;解决冲突的问题的方案之一…

针对新手的Java EE7和Maven项目-第4部分-定义Ear模块

从前面的部分恢复 第1部分 第2部分 第3部分 我们正在恢复第四部分&#xff0c;目前我们的简单项目有 Web Maven模块&#xff08;战争&#xff09; 一个ejb模块&#xff08;ejb&#xff09;&#xff0c;其中包含我们的无状态会话bean&#xff08;EJB 3.1&#xff09; 第二…

合并两个有序数组,并输出中间值

示例1&#xff1a; nums1 [1,3] nums2 [2,4] output: (23) / 2 2.5 示例2&#xff1a; nums1 [2,5,7] nums2 [3,6] output:5 Python解决方案&#xff1a; def findMedianSortedArrays(self, nums1, nums2):""":type nums1: List[int]:type nums2: List[int…

Python中关于文件路径的简单操作 [转]

1: os.listdir(path) #path为目录 功能相当于在path目录下执行dir命令&#xff0c;返回为list类型 举例&#xff1a; print os.listdir(..) 输出&#xff1a; [a,b,c,d] 2: os.path.walk(path,visit,arg) path &#xff1a;是将要遍历的目录 visit &#xff1…

生产上完成TopN统计流程

背景 现有城市信息和产品信息两张表在MySQL中&#xff0c;另外有用户点击产品日志以文本形式存在hdfs上&#xff0c;现要求统计每个个城市区域下点击量前三的产品名&#xff0c;具体信息见下方。 mysql> show tables; --------------------------------- | Tables_in_d7 …

最大公因数和最小公倍数

一丶 最大公因数求法&#xff1a;辗转相除法(也称欧几里得算法)原理: 二丶最小公倍数求法&#xff1a;两个整数的最小公倍数等于两整数之积除以最大公约数1 #include <iostream>2 3 using namespace std;4 5 //辗转相除法(欧几里得算法)6 7 int gcd(int a, int b)8 {9…

css实现div内一段文本的两端对齐

在一个固定宽度的div内&#xff0c;使得P标签内的文本两端对齐&#xff1a; text-align: justify;text-justify:inter-ideograph; <!DOCTYPE html><html lang"en"><head><meta charset"UTF-8"><title>justify</title>…