JavaScript 类继承

news2024/11/28 14:27:59

JavaScript 类继承

JavaScript 类继承使用 extends 关键字。

继承允许我们依据另一个类来定义一个类,这使得创建和维护一个应用程序变得更容易。

super() 方法用于调用父类的构造函数。

当创建一个类时,您不需要重新编写新的数据成员和成员函数,只需指定新建的类继承了一个已有的类的成员即可。这个已有的类称为基类(父类),新建的类称为派生类(子类)。

继承代表了 is a 关系。例如,哺乳动物是动物,狗是哺乳动物,因此,狗是动物,等等。

在这里插入图片描述

下面就列举几种继承的方式。
实现继承首先需要一个父类,在js中实际上是没有类的概念,在es6中class虽然很像类,但实际上只是es5上语法糖而已

function People(name){
  //属性
  this.name  = name || Annie
  //实例方法
  this.sleep=function(){
    console.log(this.name + '正在睡觉')
  }
}
//原型方法
People.prototype.eat = function(food){
  console.log(this.name + '正在吃:' + food);
}

原型链继承

父类的实例作为子类的原型

function Woman(){ 
}
Woman.prototype= new People();
Woman.prototype.name = 'haixia';
let womanObj = new Woman();

优点:

简单易于实现,父类的新增的实例与属性子类都能访问

缺点:

可以在子类中增加实例属性,如果要新增加原型属性和方法需要在new 父类构造函数的后面

无法实现多继承

创建子类实例时,不能向父类构造函数中传参数

借用构造函数继承(伪造对象、经典继承)

复制父类的实例属性给子类

function Woman(name){
 //继承了People
  People.call(this); //People.call(this,'wangxiaoxia'); 
  this.name = name || 'renbo'
}
let womanObj = new Woman();

优点:

解决了子类构造函数向父类构造函数中传递参数

可以实现多继承(call或者apply多个父类)

缺点:

方法都在构造函数中定义,无法复用

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

组合式继承

调用父类构造函数,继承父类的属性,通过将父类实例作为子类原型,实现函数复用

function People(name,age){
  this.name = name || 'wangxiao'
  this.age = age || 27
}
People.prototype.eat = function(){
  return this.name + this.age + 'eat sleep'
}

function Woman(name,age){
  People.call(this,name,age)
}
Woman.prototype = new People();
Woman.prototype.constructor = Woman;
let wonmanObj = new Woman(ren,27);
wonmanObj.eat();

缺点:

由于调用了两次父类,所以产生了两份实例

优点:

函数可以复用

不存在引用属性问题

可以继承属性和方法,并且可以继承原型的属性和方法

寄生组合继承

通过寄生的方式来修复组合式继承的不足,完美的实现继承

//父类
function People(name,age){
  this.name = name || 'wangxiao'
  this.age = age || 27
}
//父类方法
People.prototype.eat = function(){
  return this.name + this.age + 'eat sleep'
}
//子类
function Woman(name,age){
  //继承父类属性
  People.call(this,name,age)
}
//继承父类方法
(function(){
  // 创建空类
  let Super = function(){};
  Super.prototype = People.prototype;
  //父类的实例作为子类的原型
  Woman.prototype = new Super();
})();
//修复构造函数指向问题
Woman.prototype.constructor = Woman;
let womanObj = new Woman();

实例继承(原型式继承)

function Wonman(name){
  let instance = new People();
  instance.name = name || 'wangxiaoxia';
  return instance;
}
let wonmanObj = new Wonman();

优点:

不限制调用方式

简单,易实现

缺点:不能多次继承

间接多继承

我们借鉴了 Java 中的思路,实际只继承一个类,通过其他方式将其他类的功能融入。Java 中可以用 Interface 约束一个类应该拥有的行为,当然 JavaScript 也可以这么做,实现 interface 的语法糖,检查“类”中有没有重写 interface 中的所有函数。但这样的话,interface 除了做校验之用,没有实际意义,不如直接 mixin 的方式来的实在。

const mixinClass = (base, ...mixins) => {
  const mixinProps = (target, source) => {
    Object.getOwnPropertyNames(source).forEach(prop => {
      if (/^constructor$/.test(prop)) { return; }
      Object.defineProperty(target, prop, Object.getOwnPropertyDescriptor(source, prop));
    })
  };

  let Ctor;
  if (base && typeof base === 'function') {
    Ctor = class extends base {
      constructor(...props) {
        super(...props);
      }
    };
    mixins.forEach(source => {
      mixinProps(Ctor.prototype, source.prototype);
    });
  } else {
    Ctor = class {};
  }
  return Ctor;
};

class A {
  methodA() {}
}
class B {
  methodB() {}
}
class C extends mixinClass(A, B) {
  methodA() { console.log('methodA in C'); }
  methodC() {}
}

let c = new C();
c instanceof C  // true
c instanceof A  // true
c instanceof B  // false

这样就简单模拟了间接多继承,通过构造一个中间类,让中间类直接继承 A,并且 mixin 了 B 的原型成员,然后再让 C 去继承这个中间类。由于 B 是通过 mixin 方式浅拷贝了一份,B.prototype 并不在 C 的原型链上(C.proto.proto),所以 c instanceof B 为 false。

要想修正 instanceof,只能自己另外实现一套 isInstanceOf() 的逻辑,在继承时将所有的父类引用记录下来,再去比对。

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

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

相关文章

synchronized和ReentrantLock之间的区别

synchronized和ReentrantLock的区别 synchronized是一个关键字,是JVM内部实现的;ReentrantLock是标准库的一个类,是JVM外部基于Java实现的。synchronized在申请锁失败时会死等;ReentrantLock可以通过tryLock的方式等待一段时间就…

偏微分方程约束下的优化控制问题(PDE-constrained optimal control problems)

优化控制问题介绍 优化控制问题的数学形式 {min⁡(y(x),u(x))∈YUJ(y(x),u(x)),s.t. F(y(x),u(x))0in Ω,and u(x)∈Uad,\left\{\begin{aligned} &\min _{(y(\mathbf{x}), u(\mathbf{x})) \in Y \times U} J(y(\mathbf{x}), u(\mathbf{x}) ),\\ &\text { s.t. } \ \…

Python列表的元素比较

在用python处理多个列表元素时,需要处理的信息一般比较多且杂。这时运用Python列表元素比较的方法,就能快速处理列表信息,能更轻松访问每个元素。1 问题如何运用Python列表的元素比较解决问题。2 方法方法一 for循环,此情况是list…

Spring 事务【隔离级别与传播机制】

Spring 事务【隔离级别与传播机制】🍎一.事务隔离级别🍒1.1 事务特性回顾🍒1.2 事务的隔离级别(5种)🍒1.3 事务隔离级别的设置🍎二.Spring 事务传播机制🍒2.1 Spring 事务传播机制的作用🍒2.2 事…

描述性统计图表——箱线图

文章目录1、分位数1.1、分位数的概念1.2、特殊分位数1.3、分位数的计算2、箱线图2.1、概念2.2、作图步骤2.3、箱线图的作用2.3.1、定位异常值2.3.2、偏态和尾重2.3.3、数据的形状1、分位数 1.1、分位数的概念 分位数(Quantile),亦称分位点&a…

红黑树简析

一. 概念 红黑树,是一种二叉搜索树,但在每个结点上增加一个存储位表示结点的颜色,可以是Red或Black。 通过对任何一条从根到叶子的路径上各个结点着色方式的限制,红黑树确保没有一条路径会比其他路径长出俩倍,因而是…

java 自定义json解析注解 复杂json解析

java 自定义json解析注解 复杂json解析 工具类 目录java 自定义json解析注解 复杂json解析 工具类1.背景2、需求-各式各样的json一、一星难度json【json对象中不分层】二、二星难度json【json对象中出现层级】三、三星难度json【json对象中存在数组】四、四星难度json【json对象…

【c++之于c的优化 - 下】

前言 一、inline 概念 以inline修饰的函数叫做内联函数,编译时C编译器会在调用内联函数的地方展开,没有函数调用建立栈帧的开销,内联函数提升程序运行的效率。 如果在上述函数前增加inline关键字将其改成内联函数,在编译期间编译…

契约锁与200多家软件厂商实现集成应用,实现更多业务电子签需求

在中大型组织的数字化建设中,电子签章需求紧紧围绕业务展开,实现电子签章与管理软件集成应用已经成为普遍需求。 契约锁数字可信产品拥有200多家管理软件厂商集成对接经验,覆盖ERP、OA、专项业务系统、移动APP应用、低代码平台、BPM流程、小程…

Vue - 使用Lodash实现防抖和节流

GitHub Demo 地址 在线预览 Lodash 官网 参考: Vue 防抖节流 详细介绍 vue 优雅的实现防抖和节流 防抖、节流的介绍 js防抖和节流的实现原理及应用场景 js防抖节流应用场景及写法 JS中的防抖 什么的防抖和节流? 函数节流(throttle&#x…

论文翻译:2022_Phase-Aware Deep Speech Enhancement: It’s All About The Frame Length

摘要 虽然相位感知语音处理近年来受到越来越多的关注,但大多数帧长约为32 ms的窄带STFT方法显示出相位对整体性能的影响相当有限。与此同时,现代基于深度神经网络(DNN)的方法,如Conv-TasNet,隐式修改幅度和相位,在非常…

CUDA虚拟内存管理

CUDA中的虚拟内存管理 文章目录CUDA中的虚拟内存管理1. Introduction2. Query for support3. Allocating Physical Memory3.1. Shareable Memory Allocations3.2. Memory Type3.2.1. Compressible Memory4. Reserving a Virtual Address Range5. Virtual Aliasing Support6. Ma…

自动化测试实战篇(6)jmeter实现脚本录制,抓取接口信息

Jmeter中脚本录制,是一个非常方便找到接口内容的一种工具,不用想fiddler抓包定位接口信息速度不够快 设置代理服务器 这里以谷歌浏览器为例子 打开您的计算机的代理设置 把代理服务器打开这里就以127.0.0.1和8080端口为例子,这个需要记住…

ChatGPT背后的经济账

ChatGPT能否取代Google、百度这样的传统搜索引擎?为什么中国不能很快做出ChatGPT?当前,对这些问题的探讨大多囿于大型语言模型(LLM)的技术可行性,忽略或者非常粗糙地估计了实现这些目标背后的经济成本&…

((蓝桥杯 刷题全集)【备战(蓝桥杯)算法竞赛-第4天(搜索与图论-下 专题)】( 从头开始重新做题,记录备战竞赛路上的每一道题 )距离蓝桥杯还有63天

🏆🏆🏆🏆🏆🏆🏆 欢迎观看我的博客,如有问题交流,欢迎评论区留言,一定尽快回复!(大家可以去看我的专栏,是所有文章的目录&a…

差分隐私学习笔记

2021网络空间安全西湖学术论坛线上报告中介绍了差分隐私过去发展,目前现状以及未来研究方向。博主对这个报告进行了介绍与总结。总结中提到学习差分隐私最重要的环节是: 了解差分隐私的基本机制:拉普拉斯机制、指数机制和高斯机制差分隐私的组…

【数据结构与算法】前缀树的实现

🌠作者:阿亮joy. 🎆专栏:《数据结构与算法要啸着学》 🎇座右铭:每个优秀的人都有一段沉默的时光,那段时光是付出了很多努力却得不到结果的日子,我们把它叫做扎根 目录👉…

54 循环神经网络 RNN【动手学深度学习v2】

54 循环神经网络 RNN【动手学深度学习v2】 深度学习学习笔记 学习视频:https://www.bilibili.com/video/BV1D64y1z7CA/?spm_id_from333.880.my_history.page.click&vd_source75dce036dc8244310435eaf03de4e330 对序列化数据集的训练网络,通常称为RN…

第三章 Opencv图像像素操作

目录1.像素1-1.确定像素位置1-2.获取指定像素的像素值1-3.修改像素的BGR值2.用numpy模块操作像素2-1.创建图像1.创建黑白图像2.创建彩色图像3.创建随机图像2-2.拼接图像1.水平拼接hstack()方法2.垂直拼接vstack()方法1.像素 1.像素是构成数字图像的最小单位。每一幅图像都是由M…

【第29天】SQL进阶-查询优化- performance_schema系列实战四:查看最近的SQL执行信息(SQL 小虚竹)

回城传送–》《32天SQL筑基》 文章目录零、前言一、 查看最近的top sql1.1 数据准备(如果已有数据可跳过此操作)1.2 查询events_statements_summary_by_digest表二、查看最近执行失败的SQL2.1 开启第一个会话,执行错误sql2.2 开启第二个会话&…