当前位置: 首页 > news >正文

js的继承

一、原型链继承

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

function Father(){this.name = 'Tony'
}function Son() {}Son.prototype = new Father()let son = new Son();console.log(son.name) // Tony

缺点:

  1. 父类所有的引用类型属性都会被所有子类共享,一个子类修改了属性值就会影响到其他子类。
  2.  子类不能给父类的构造函数传参

 二、构造函数继承

        在子类构造函数中调用父类构造函数并通过call或apply给父类传参、修改this指向。

function Father(name){this.info = {name:name,job:'teacher'}this.sayName(){console.log(this.info.name)}
}function Son (name){Father.call(this,name)
}let s = new Son('Jerry');let s2 = new Son ('Mike');console.log(s.info.name) //Jerryconsole.log(s2.info.name) // Mike

        通过使用call()apply()方法,Parent构造函数在为Child的实例创建的新对象的上下文执行了,就相当于新的Child实例对象上运行了Parent()函数中的所有初始化代码,结果就是每个实例都有自己的info属性。 

 优点:

  1. 可以给父类传参
  2. 父类的引用类型不会被子类共享

缺点:

  1. 子类不能访问父类原型上定义的方法(prototype上挂在的方法) 

三、组合式继承

        组合式继承综合了原型链继承和构造方法继承的优点,通过原型链继承获得父类原型对象上的属性和方法。通过引用父类构造方法达到隔离子类共享属性,给父类传递参数 。

function Father (name) {this.name=name}Father.prototype.sayName=function(){console.log(this.name)
}function Son (name) {Father.call(this,name)
}
Son.prototype = new Father()
//手动挂载构造起,指向自己的构造方法
Son.prototype.constructor = Sonlet s1 = new Son('Mike')s1.sayName() // Mikelet s2 = new Son('Jerry')s2.sayName() //Jerry

 优点:

  1. 父类的方法可以复用
  2. 子类可以向父类传参
  3. 父类构造函数中的引用类型数据不会被共享

四、原型继承

        对参数对象的一种浅复制 ,当Object.create()只有一个参数时与下面代码中的Object()方法相同

let student = {hobbies:['music','football','basketball']
}function Object (o) {function F(){}F.prototype=oreturn new F()
}let s1 = Object(student)
s1.hobbies.push('sing')console.log(s1.hobbies) //['music', 'football', 'basketball', 'sing']
let s2 = Object(student)
s2.hobbies.push('dance')
console.log(s2.hobbies) //['music', 'football', 'basketball', 'sing','dance']

优点:

  1. 父类方法可复用 

缺点:

  1. 父类的引用会被子类共享
  2. 子类不能向父类传参

五、寄生试继承

         寄生式继承是在原型继承基础上的拓展,类似于一个工厂模式,即创建一个用于封装继承的函数,该函数内部对参数对象做了增强。

function Object (person){function F () {}F.prototype = person;return new F()
}function createObject(person){let obj = Object(person)obj.sayHello = function(){console.log('hello')}return obj
}let person = {name:'tony',age:32
}let p1 = createObject(person)p1.sayHello() //hellop1.name //tony

六、寄生式组合继承

        组合式继承有看似完美却有一个缺点,那就是父类的构造函数会被执行两次,一次是父类实例化时,一类是子类实例化时。这样就会造成内存没必要的消耗,寄生式组合继承正是弥补了这个短板,时目前最为理想的继承方式。

function extend(subClass,superClass){var prototype = object(superClass.prototype);//创建对象prototype.constructor = subClass;//增强对象subClass.prototype = prototype;//指定对象
}

七、ES6继承

class supClass {constructor(name) {this.name = name}sayName(){console.log(this.name)}
}class subClass extends supClass{constructor (name) {super(name)this.name = name}
}let sub = new subClass ('subClass')console.log(sub.name)sub.sayName() // subClass

相关文章:

js的继承

一、原型链继承 将父类的实例作为子类的原型 function Father(){this.name Tony }function Son() {}Son.prototype new Father()let son new Son();console.log(son.name) // Tony缺点: 父类所有的引用类型属性都会被所有子类共享,一个子类修改了属…...

HONEYWELLL 05701-A-0325 控制脉冲模块

运动控制: HONEYWELLL 05701-A-0325 控制脉冲模块可以用于运动控制应用,例如控制步进电机或伺服电机,以实现精确的位置和速度控制。 定位系统: 在自动化设备和机器人中,这些模块可以用于确定物体的位置和方向&#xf…...

Qt扩展-QCustomPlot 简介及配置

QCustomPlot 简介及配置 一、概述二、安装教程三、帮助文档的集成 一、概述 QCustomPlot是一个用于绘图和数据可视化的Qt 控件。它没有进一步的依赖关系,并且有良好的文档记录。这个绘图库专注于制作好看的、发布质量的2D绘图、图形和图表,以及为实时可…...

python教程:selenium WebDriver 中的几种等待--sleep(),implicitly_wait(),WebDriverWait()

大家早好、午好、晚好吖 ❤ ~欢迎光临本文章 如果有什么疑惑/资料需要的可以点击文章末尾名片领取源码 强制等待:sleep() import time sleep(5) #等待5秒设置固定休眠时间,单位为秒。 由python的time包提供, 导入 time 包后就可以使用。’ 缺点: 不…...

从裸机开始安装操作系统

目录 一、预置知识 电脑裸机 win10版本 官方镜像 V.S. 正版系统 二、下载微软官方原版系统镜像 三、使用微PE系统维护U盘 四、安装操作系统 五、总结 一、预置知识 电脑裸机 ●只有硬件部分,还未安装任何软件系统的电脑叫做裸机。 ●主板、硬盘、显卡等必…...

redhat 6.1 测试环境安装 yum

redhat 6.1 测试环境安装 yum 记录 1. 新建虚拟机 1.1 自定义建立虚拟机 自定义创建新的虚拟机 选择硬件兼容性 创建空白硬盘,稍后选择 iso 文件创建系统。 选择操作系统类型 为虚拟机命名 选择处理器配置 选择虚拟机内存 选择虚拟机网络类型 选择…...

WARNING:tensorflow:Your input ran out of data; interrupting training. 解决方法

问题详情: WARNING:tensorflow:Your input ran out of data; interrupting training. Make sure that your dataset or generator can generate at least steps_per_epoch * epochs batches (in this case, 13800 batches). You may need to use the repeat() funct…...

ChunJun(OldNameIsFlinkX)

序言 ChunJun主要是基于Flink实时计算框架,封装了不同数据源之间的数据导入与导出功能.我们只需要按照ChunJun的要求提供原始与目标数据源的相关信息给Chunjun,然后它会帮我们生成能运行与Flink上的算子任务执行,这样就避免了我们自己去根据不同的数据源重新编辑读入与读出的方…...

MySQL的时间差函数、日期转换计算函数

MySQL的时间差函数(TIMESTAMPDIFF、DATEDIFF)、日期转换计算函数(date_add、day、date_format、str_to_date) 时间差函数(TIMESTAMPDIFF、DATEDIFF) 需要用MySQL计算时间差,使用TIMESTAMPDIFF、DATEDIFF,记录一下实验结果 --0 …...

【神印王座】悲啸洞穴之物揭晓,圣采儿差点被骗,幸好龙皓晨聪明

Hello,小伙伴们,我是小郑继续为大家深度解析神印王座。 神印王座动漫现阶段已经出到龙皓晨等人接取新任务深入魔族地界的阶段,而龙皓晨等人接取的任务想必现在大家都知道了,那就是探索魔族地界中的悲啸洞穴。但是大家知道悲啸洞穴里面藏着什么…...

性能测试之使用Jemeter对HTTP接口压测

我们不应该仅仅局限于某一种工具,性能测试能使用的工具非常多,选择适合的就是最好的。笔者已经使用Loadrunner进行多年的项目性能测试实战经验,也算略有小成,任何性能测试(如压力测试、负载测试、疲劳强度测试等&#…...

Spring面试题13:Spring中ApplicationContext实现有哪些?Bean工厂和Applicationcontext有什么区别

该文章专注于面试,面试只要回答关键点即可,不需要对框架有非常深入的回答,如果你想应付面试,是足够了,抓住关键点 面试官:Spring中ApplicationContext实现有哪些? 在Spring框架中,有以下几种ApplicationContext的实现: ClassPathXmlApplicationContext:从类路径下的…...

Spring 学习(六)代理模式

10. 代理模式 案例 10.1 静态代理 角色分析 抽象角色:一般使用接口或者抽象类实现。真实角色:被代理的角色。代理角色:代理真实角色,含附属操作。客户:访问代理对象的角色。 租房案例 定义租赁接口 /*** TODO* 租房*…...

Educational Codeforces Round 155 (Rated for Div. 2) - D Sum of XOR Functions

学到的几个知识点: 1.拆位 对于整体上的异或操作可以转化为31个二进制位上的操作,每一位再上 。 将一次操作拆为31次来方便操作。 2. s[i]表示异或前缀和,l~r间的异或和为s[r] ^ s[l - 1] ----> 拆完位后这个公式还能再推出一个性…...

[C++ 网络协议] I/O流分离所带来的半关闭问题

1.问题和解决方法 根据所学内容,I/O流分离现如今有如下2种方法: 1.调用进程fork函数,分离出子进程,主进程和子进程分别进行输入流的读和输出流的写。 2.用FILE指针按读模式和写模式将输入流和输出流进行区分。 第一种方法&#…...

根据文章段落内容自动插入图片php版

每篇内容根据段落判断插入图片代码附上&#xff1a; $chatd"<table>";if(stripos($content,$chatd)0){//随机输出三张图功能if($moduleid!37 &&$thumb){//判断是否存在图$idrand(1,999999);$midrand(1,9999999);$getimg"http://www.nongpin88.co…...

在GEHC的第一个sprint记录

今天是进入GEHC XR ATX的第25天&#xff0c;是周日&#xff0c;下周二我的第一个sprint也就到期了&#xff0c;幸好在这周五晚上完成了&#xff0c;当然还差个分享。在此记录第一个sprint中两个story过程。 第一个story是操作固定式DR设备进行exposure整个过程。这是所有新人必…...

MFC 绘图

效果图&#xff1a;三张bmp图 字 竖线 组成 在OnPaint()函数中 CPaintDC dc(this);CRect rect;GetClientRect(&rect); //获取客户区矩形CDC dcBmp; //定义并创建一个内存设备环境dcBmp.CreateCompatibleDC(&dc); //创建兼容性DCCBitmap …...

算法 用两个栈实现队列-(栈+队列)

牛客网: BM42 题目: 用两个栈模拟队列 思路: stack1, stack2两个栈&#xff0c;入队只选择stack1, 出队只选择stack2, 如果stack2为空&#xff0c;将stack1元素全部出栈并入栈stack2。 代码: // gopackage mainvar stack1 [] int var stack2 [] intfunc Push(node int) {st…...

Android单编模块报FAILED: ninja: unknown target ‘MODULES-IN-vendor错误解决

有时我们需要单编Android AOSP一个APK或库文件或二进制&#xff0c;用来调试。 但可能这个模块本身是不参与系统整编编译的。我们在使用mmm或mm单独编译时就会报这个错误。 在检查Android.mk或Android.bp无误后&#xff0c;就要怀疑是不是这个目录的上级目录是不是没有包含这…...

Xshell远程连接Kali(默认 | 私钥)Note版

前言:xshell远程连接&#xff0c;私钥连接和常规默认连接 任务一 开启ssh服务 service ssh status //查看ssh服务状态 service ssh start //开启ssh服务 update-rc.d ssh enable //开启自启动ssh服务 任务二 修改配置文件 vi /etc/ssh/ssh_config //第一…...

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする 1、前言(1)情况说明(2)工程师的信仰2、知识点(1) にする1,接续:名词+にする2,接续:疑问词+にする3,(A)は(B)にする。(2)復習:(1)复习句子(2)ために & ように(3)そう(4)にする3、…...

基于当前项目通过npm包形式暴露公共组件

1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹&#xff0c;并新增内容 3.创建package文件夹...

Matlab | matlab常用命令总结

常用命令 一、 基础操作与环境二、 矩阵与数组操作(核心)三、 绘图与可视化四、 编程与控制流五、 符号计算 (Symbolic Math Toolbox)六、 文件与数据 I/O七、 常用函数类别重要提示这是一份 MATLAB 常用命令和功能的总结,涵盖了基础操作、矩阵运算、绘图、编程和文件处理等…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开&#xff0c;首…...

A2A JS SDK 完整教程:快速入门指南

目录 什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除 什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库&#xff…...

AI+无人机如何守护濒危物种?YOLOv8实现95%精准识别

【导读】 野生动物监测在理解和保护生态系统中发挥着至关重要的作用。然而&#xff0c;传统的野生动物观察方法往往耗时耗力、成本高昂且范围有限。无人机的出现为野生动物监测提供了有前景的替代方案&#xff0c;能够实现大范围覆盖并远程采集数据。尽管具备这些优势&#xf…...

iview框架主题色的应用

1.下载 less要使用3.0.0以下的版本 npm install less2.7.3 npm install less-loader4.0.52./src/config/theme.js文件 module.exports {yellow: {theme-color: #FDCE04},blue: {theme-color: #547CE7} }在sass中使用theme配置的颜色主题&#xff0c;无需引入&#xff0c;直接可…...

[ACTF2020 新生赛]Include 1(php://filter伪协议)

题目 做法 启动靶机&#xff0c;点进去 点进去 查看URL&#xff0c;有 ?fileflag.php说明存在文件包含&#xff0c;原理是php://filter 协议 当它与包含函数结合时&#xff0c;php://filter流会被当作php文件执行。 用php://filter加编码&#xff0c;能让PHP把文件内容…...

Caliper 负载(Workload)详细解析

Caliper 负载(Workload)详细解析 负载(Workload)是 Caliper 性能测试的核心部分,它定义了测试期间要执行的具体合约调用行为和交易模式。下面我将全面深入地讲解负载的各个方面。 一、负载模块基本结构 一个典型的负载模块(如 workload.js)包含以下基本结构: use strict;/…...