童鞋们,我们今天聊聊js的继承,关于继承,平时开发基本用不到,但是面试没有不考的,我就想问,这是人干的事吗?

  好吧,迫于社会主义核心价值观,我们今天就来简单说一说js的继承,谁让它是面向对象编程很重要的一个方面呢

  首先一句定义,什么是继承:

  A对象通过继承 B 对象,就能直接拥有 B 对象的所有属性和方法。

  

  常见的集成方式有六种,我们今天依次简单的说一下,现在让我们把这六种方式分一下类,大致上可分为三类

  

  第一类:普通类

  这类继承方法有个特性,就是简单,容易实现,一共两种;

  

  1、原型链继承

  关键点:子类型的原型为父类型的一个实例对象,子类继承父类的属性和方法是将父类的私有属性和公有方法都作为自己的公有属性和方法

  

  

  缺点

    •   无法实现多继承

    •   来自原型对象的所有属性被所有实例共享

    •   创建子类实例时,无法向父类构造函数传参

    •   要想为子类新增属性和方法,必须要在Student.prototype = new Person() 之后执行,不能放到构造器中

  

  2、借用构造函数继承

  关键点:在子类型构造函数中通用call()调用父类型构造函数

  

  

  缺点

    •   实例并不是父类的实例,只是子类的实例

    •   只能继承父类的实例属性和方法,不能继承原型属性和方法

    •   无法实现函数复用,每个子类都有父类实例函数的副本,影响性能

  

    

  第二类:学习进化类

  这类继承方法就比较牛了,如果说上面两种方式都是普通型的,那接下来我们要介绍的就是那些通过学习其他类型身上的有点,改造自己不足的进化类型了,一共三种;

  

  1、原型链+借用构造函数的组合继承

  关键点:通过调用父类构造,继承父类的属性并保留传参的优点,然后通过将父类实例作为子类原型,实现函数复用

  

  缺点调用了两次父类构造函数,生成了两份实例

  评价: 你看他就很牛了,他把上面的两种普通类型结合了,形成了自己独特的表

  

  2、(原型链+借用构造函数的组合继承)plus

  关键点:这种方式通过父类原型和子类原型指向同一对象,子类可以继承到父类的公有方法当做自己的公有方法,而且不会初始化两次实例方法/属性,避免的组合继承的缺点

  

  缺点:没办法辨别是实例是子类还是父类创造的,子类和父类的构造函数指向是同一个。

  评价:这个类型就更厉害了,如果上一个类型是iPhone8,那这个就是8plus,他是在上一个版本的基础上,又自我进化了,修补了初始化两次实例方法和属性这个缺点。

  

  3、(原型链+借用构造函数的组合继承)s

  关键点:借助原型可以基于已有的对象来创建对象,var B = Object.create(A)以A对象为原型,生成了B对象。B继承了A的所有属性和方法。

  

  

   

  缺点:几乎进化到了完美形态!

  评价:学习是永无止境的,苹果公司也继8plus之后推出了更强的手机系列,8s,又是一次进化;

  

  

  第三类:天赋型

  我们要承认一件事,世上真的有天赋这个东西,接下来我们要讲的天赋型就属于这种,它不同于基础型和学习进化型,他是一种独树一帜的方式,而赋予它天赋的则来自ES6的class关键字,仅有一种;

  

  1、ES6中class 的继承

  关键点:通过extends关键字实现继承

  

  

   缺点:它在有着以上所有优点的前提下,存在着一个缺点,类似于慧极必伤,那就是并不是所有的浏览器都支持class关键字。

    

  OK,开始敲黑板,以上三类六种就是我们今天要说的js继承方法,当然三类是我胡诌的,只是希望能加深大家的理解;

  

  参考文章

    •   JS实现继承的几种方式

    •   JavaScript深入之继承的多种方式和优缺点

    •   JavaScript常见的继承方式

    •   阮一峰ES6入门之class的继承

    • JavaScript 常见的继承方式

  

JS继承(简单理解版)的更多相关文章

  1. require.js 模块化简单理解

    组件化 基于UI 样式布局 没有过多 js 代码操作的 比如:一个导航栏 一个表单 一个搜索框 一个侧边栏 一个html 等等.... 模块化 基于功能模块 一个可以替换的js部分称之为模块(modu ...

  2. 关于js动画简单理解;

    1.CSS样式提供了运动 过度的属性:transition 过度的属性值:attr  ,time  , liner  ,  delay: 值分别是:属性(css),花费的时间,变化的速度(默认匀速), ...

  3. 对于js原型和原型链继承的简单理解(第三种,复制继承)

    复制继承:简单理解,就是把父对象上的所有属性复制到自身对象上: function Cat(){ this.climb = function(){ alert("我会爬树"); } ...

  4. JS继承的从入门到理解

    开场白 大三下学期结束时候,一个人跑到帝都来参加各厂的面试,免不了的面试过程中经常被问到的问题就是JS中如何实现继承,当时的自己也是背熟了实现继承的各种方法,回过头来想想却不知道__proto__是什 ...

  5. 【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题(二)-callback,promise,generator,async-await JS的进阶技巧 前端面试送命题(一)-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制

    [原创]分布式之数据库和缓存双写一致性方案解析(三)   正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 ...

  6. js简单 图片版时钟,带翻转效果

    js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  7. Js 职责链模式 简单理解

    js 职责链模式 的简单理解.大叔的代码太高深了,不好理解. function Handler(s) { this.successor = s || null; this.handle = funct ...

  8. js 继承的简单易懂小例子

    js 继承 今天主要说原型链继承.构造继承.组合继承三种常用继承方式,分享一下我的理解. 原型链继承例子1 //原型继承function A(name){ this.name = name;}func ...

  9. 如何简单理解js中this的指向

    前序 每个人学js都会被this指向这个东西搞得很蒙,那就是this的指向问题.首先,我们要明白 this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上thi ...

随机推荐

  1. jq-demo-轮播图

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. js求100以内的素数

    //打印2~100之间的数 ; i< ; i++){ var a = true; ; j < i; j++){ //判断i能否被j整除 ){ //能被整除则说明不是素数,修改布尔值为fal ...

  3. Thymeleaf语法总结

    Thymeleaf是Spring boot推荐使用的模板引擎. 一.th属性 html有的属性,Thymeleaf基本都有,而常用的属性大概有七八个.其中th属性执行的优先级从1~8,数字越低优先级越 ...

  4. Delphi txt文件读取及写入

    简介:Delphi支持三种文件类型:文本文件.记录文件.无类型文件.文本文件的读...   在进行win32开发中对文件的读写是最常用的操作之一 Delphi 支持三种文件类型:  文本文件.记录文件 ...

  5. SCOI 2014 省选总结

    总的来说作为高一党,去做省选难度的题完全就是去玩的,还是找惯例起身跪hja. 跪毕,看看自己惨不忍睹的成绩,我只想说:电子坑大为什么day1的暴力只有10分!为什么呢?我笑看题面: 方伯伯种玉米,方伯 ...

  6. Electron是个啥?

    于2013年作为构建Github上可编辑的文本编辑器Atom的框架而被开发出来 是目前开源开发者.初创企业和老牌公司常用的开发工具 是桌面应用框架 相当于一个浏览器的外壳,可以把网页程序嵌入到壳里面, ...

  7. NOIp2018集训test-9-16(联考二day2)

    T1旋转子段 一开始脑袋抽了花了近一个小时写了个跟这题毫无关系的莫名其妙的代码,一急代码就各种bug,最后t1就花了一个半小时多,然后后面时间不太够了,考得稀烂. 因为每个数存在唯一的中心使得绕这个中 ...

  8. 使用RAS+AES对接口数据加解密

    在实际开发中,会遇到两个系统之间传输数据,为了对传输的数据进行保护,需要发送方对接口数据进行加密,接收方对数据解密. 对数据加密,采用RSA+AES双重加密,是数据更加安全. 使用前提: 如果客户端本 ...

  9. 11.RabbitMQ单机集群

    RabbitMQ集群设计用于完成两个目标:允许消费者和生产者在RabbitMQ节点崩溃的情况下继续运行,以及通过添加更多的节点来扩展消息通信的吞吐量. RabbitMQ会始终记录以下四种类型的内部元数 ...

  10. oracle一体机(exdata)创建ACFS文件系统

    ACFS是一个支持多个平台,可扩展的,基于ORACLE ASM的集群文件系统,可以用来存储数据库和各种应用的文件,包括数据库的trace文件,alert日志文件和配置文件等等,也可以用来存储视频,音频 ...