为什么需要继承？

在实际编码的过程中，如果有很多类似的方法都存放于构造函数中，这样会导致内存的浪费（内存泄漏），在这种情况下我们就需要用到继承。

继承是什么？

所谓继承就是通过某种方式让一个对象可以访问到另一个对象中的属性和方法。

常见的六种继承方式

1、原型链继承

2、构造函数继承

3、组合式继承

4、原型式继承

5、寄生式继承

6、组合寄生式继承

一、原型链继承

 function parent(){this.name = '张三'this.age = 18this.arr = ['html','ccss'];}parent.prototype.say = function(){console.log('hellow')}function son(){}son.prototype = new parent()var son1 = new son();var son2 = new son();son1.arr.push('javaScript');son2.arr.push('vue');console.log(son1.arr)   console.log(son2.arr)

优点：实现父类属性和方法的继承；
缺点：
1、所有子类的实例共享父类的属性；
2、子类无法传参；

二、构造函数继承

 function parent(name){this.name = name;this.age = 18this.arr = ['html','ccss'];}parent.prototype.say = function(){console.log('hellow')}function son(name){parent.call(this,name);}var son1 = new son('张三');var son2 = new son('李四');son1.arr.push('vue');son2.arr.push('React');console.log(son1)console.log(son2)

优点：
1、子类不再共享父类的属性；
2、子类可以进行传参；

缺点：子类每次实例化的时候，父类的方法都要创建一遍，造成内存浪费；

三、组合式继承

 function parent(name){this.name = name;this.age = 18this.arr = ['html','ccss'];}parent.prototype.say = function(){console.log(this.name)}function son(name){parent.call(this,name);}son.prototype = new parent(); //继承挂载在父类上的方法var son1 = new son('张三');var son2 = new son('李四');son1.arr.push('vue');son2.arr.push('react');console.log(son1)console.log(son2)

优点：
1、实现父类属性.方法的继承；
2、公用父类方法；
缺点：每次创建子类实例时,会调用两次父类的构造函数 ,一次是父类的实例赋值给子类的prototype的时候,一次是创建子类的时候；

四、原型式继承

 function func(obj){function son(){};son.prototype = obj;return new son();}var parent = {name : 'Lisi ',age : 18,list:[]}var son1 = func(parent);var son2 = func(parent);son1.list.push('vue');son2.list.push('react');console.log(son1)console.log(son2)

优缺点：和原型链类似；

五、寄生式继承

function JiSheng(obj){var clone = Object.create(obj);clone.say = function(){console.log('新增方法')} return clone}var parent = {name : 'Lisi ',age : 18,list:[]}var son1 = JiSheng(parent)var son2 = JiSheng(parent)son1.list.push('vue');son2.list.push('react');console.log(son1)console.log(son2)

优缺点：和构造函数继承类似
但是包含引用类型值的属性始终都会共享相应的值，就像使用原型模式一样。

六、寄生式组合继承

function JiSheng(son,parent){var clone = Object.create(parent.prototype);  //共享父类方法son.prototype = clone;  clone.constructor = son;}function parent(name){this.name = name;this.arr = [];}parent.prototype.say = function(){console.log(this.name)}function son(name){parent.call(this,name);}JiSheng(son,parent)var son1 = new son('张三');var son2 = new son('李四');son1.arr.push('html');son2.arr.push('css');console.log(son1)console.log(son2)

优点：高效率只调用一次父构造函数，并且因此避免了在子原型上面创建的不必要、多余的属性。与此同时，原型链还保持不变。

JavaScript中6种常见的继承方式相关推荐

Spring RestTemplate中几种常见的请求方式GET请求 POST请求 PUT请求 DELETE请求
Spring RestTemplate中几种常见的请求方式原文地址: https://blog.csdn.net/u012702547/article/details/77917939 版权声明:本 ...
unity3d中画线有几种方式_Spring RestTemplate中几种常见的请求方式
原文 https://segmentfault.com/a/1190000011093597 在Spring Cloud中服务的发现与消费一文中,当我们从服务消费端去调用服务提供者的服务的时候,使用了 ...
Spring RestTemplate中几种常见的请求方式
关注公众号[江南一点雨],专注于 Spring Boot+微服务以及前后端分离等全栈技术,定期视频教程分享,关注后回复 Java ,领取松哥为你精心准备的 Java 干货! 在Spring Cloud ...
Java RestTemplate中几种常见的请求方式
在REST接口的设计中,利用RestTemplate进行接口测试是种常见的方法.本文主要从以下四个方面来看RestTemplate的使用: GET请求 POST请求 PUT请求 DELETE请求 OK ...
Mysql中4种常见的插入方式
4种常见insert方式准备工作 CREATE TABLE `identity_table` (`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键id' ...
JavaScript 中 15 种常见的数组操作
本文 GitHub https://github.com/qq44924588... 上已经收录,更多往期高赞文章的分类,也整理了很多我的文档,和教程资料.欢迎Star和完善,大家面试可以参照考点复习 ...
javascript中五种常见的DOM方法
getElementById将返回一个与那个有着给定id属性值的元素节点对应的对象. <html xmlns="http://www.w3.org/1999/xhtml"&g ...
java获取项目中的路径_java中几种获取项目路径方式
转自http://caodaoxi.iteye.com/blog/1234805 在jsp和class文件中调用的相对路径不同. 在jsp里,根目录是WebRoot 在class文件中,根目录是Web ...
JavaScript中四种不同的属性检测方式比较
JavaScript中四种不同的属性检测方式比较 1. 用in方法 var o = {x:1}; "x" in o; //true "y" in o; //fa ...

JavaScript中6种常见的继承方式