js继承,原型链继承,构造函数继承,组合式继承,原型式继承,寄生式继承,组合寄生式继承,extends继承

继承的理解,复用父类的属性和方法并增加新的属性和方法

目录

1. 原型链继承:

2. 构造函数继承

3. 组合式继承

4. 原型式继承

 5. 寄生式继承

6. 组合寄生式继承

7. extends继承


1. 原型链继承:

父类构造函数的实例赋值给子类原型

 function Parent(age){this.age=agethis.color=['green']}function Child(){}Child.prototype=new Parent()let child = new Child()let child1 = new Child()child.color.push('red')console.log(child.color,child1.color)//两个输出都是['green', 'red']

2. 构造函数继承

子类通过call调用父类的构造函数,解决原型链继承的两个问题,其一是共享父类引用类型的属性,其二是子类不能向父类传参

但是带来问题是每创建一个实例都会执行一次父类构造函数,相当于把父类的实例属性复制给子类

不能复用,并且不能继承原型链上属性和方法

function Parent(age){this.age=agethis.color=['green']}function Child(age){
Parent.call(this,age)}Child.prototype=new Parent()let child = new Child()let child1 = new Child()child.color.push('red')console.log(child.color,child1.color)//第一个输出是['green', 'red'],第二个输出是green

3. 组合式继承

结合构造函数继承来 继承实例属性和方法,利用 原型链继承 继承原型链属性和方法

function Parent(age) {this.age = age;this.color = ['green'];}function Son(age) {Parent.call(this, age); // 借用构造函数继承实例属性}// 使用 Object.create 优化原型链继承Son.prototype = new Parent()Son.prototype.constructor = Son;// 进一步添加原型方法,以验证继承效果Parent.prototype.sayAge = function () {console.log(this.age);};Son.prototype.sayHello = function () {console.log('Hello');};// 测试代码let son1 = new Son(10);let son2 = new Son(20);son1.color.push('red');console.log(son1.color); // ['green', 'red']console.log(son2.color); // ['green']son1.sayAge(); // 10son2.sayAge(); // 20son1.sayHello(); // Helloson2.sayHello(); // Hello

4. 原型式继承

利用es5里的object.create,就是 通过已有对象创建新对象,让新对象原型链指向已有对象

通过已有的对象作为新对象的原型,生成一个新的对象实例

选择性修改新对象属性

他的缺点和原型链继承一样

let person = {firstname:'John',
lastname:'foe',
fullname:function(){
return this.firstname+""+this.lastname
}}let person1 = Object.create(person)
let person2 = Object.create(person)//已有对象生成新对象,已有对象作为新对象的原型生成新实例
//person1和person2都是创建出来的实例
person1.firstname='Jane'
console.log(person1.fullname())//jane foe
console.log(person2.fullname())//john foe//体现缺点的代码:let person={firstname:'li',lastname:['green'],fullname:function(){return this.firstname+""+this.lastname}}let person1 = Object.create(person)let person2 = Object.create(person)person1.lastname.push('red')console.log(person1.fullname(),person2.fullname())//ligreen,red ligreen,red

模拟object.create:

function objectfactory(o){function F(){}
F.prototype=o
return new F()
}

 5. 寄生式继承

可以添加新的属性和方法, 使用现有对象作为原型创建一个新对象,增强这个对象,添加新属性或方法,返回这个对象

同样难以重用

let person={firstname:'li',lastname:['green'],fullname:function(){return this.firstname+""+this.lastname}}function jisheng(o){let clone=Object.create(o)clone.newfunc=function(){console.log('haha')}return clone//千万别忘了返回值}let child1 = jisheng(person)let child2 = jisheng(person)console.log(child1.newfunc(),child2.newfunc())

6. 组合寄生式继承

优化了组合继承中需要 父类构造函数被调用两次,一次在创建子类原型,一次在子类构造函数

基于object.create

接受两个参数,子类构造函数和父类构造函数
第一步创建父类原型的副本
然后 返回的p对象设置constructor属性,解决由于重写原型导致默认constructor丢失的问题,最后将新创建的对象赋值给子类型的原型

function inherit(subtype,supertype){let p = Object.create(supertype)
p.constructor=subtype
subtype.prototype=p}

原型式继承,寄生继承和寄生组合都使用object.create

7. extends继承

利用es6类和构造函数实现继承

class Parent{constructor(age){
this.age=age
}
s(){console.log('hello')}}class Son extends Parent{t(){
console.log('you')
}}let son1 = new Son(30)
son1.s()
son1.t()

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

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

相关文章

谷粒商城实战(033 业务-秒杀功能4-高并发问题解决方案sentinel 2)

Java项目《谷粒商城》架构师级Java项目实战,对标阿里P6-P7,全网最强 总时长 104:45:00 共408P 此文章包含第332p-第p335的内容 熔断降级 开启对Feign远程服务的熔断保护机制 feign.sentinel.enabletrue 这里我们只是调用方加就行 被调用方不用加 正常…

C调用C++中的类

文章目录 测试代码 测试代码 在C语言中调用C类,需要遵循几个步骤: 在C代码中,确保C类的函数是extern “C”,这样可以防止名称修饰(name mangling)。 使用头文件声明C类的公共接口,并且为这个…

JS如何判断一个对象是否为数组?

在JavaScript中,有多种方法可以判断一个对象是否为数组。以下是一些常用的方法: 使用Array.isArray()方法: 这是ECMAScript 5.1引入的一个方法,专门用于判断一个对象是否为数组。 let obj [1, 2, 3]; console.log(Array.isA…

NetSuite Saved Search 之 Filter By Summary

在某些业务场景中,用户需要一个TOP X的报表。例如,过去一段时间内,最多数量的事务处理类型。这就需要利用Saved Search中的Filter By Summary功能。 这在Criteria下的Summary页签里可以定义。其作用是对Result中Summary类型的结果进行过滤。也…

华为od-C卷200分题目 - 1分月饼

华为od-C卷200分题目 - 1分月饼 题目描述 中秋节&#xff0c;公司分月饼&#xff0c;m个员工&#xff0c;买了n个月饼&#xff0c;m<n&#xff0c;每个员工至少分1个月饼&#xff0c;但可以分多个&#xff0c; 单人分到最多月饼的个数是Max1&#xff0c;单人分到第二多月饼…

Flutter 实现StackAllocator简化FFI局部变量的内存管理

文章目录 前言一、为何简化&#xff1f;1、通常做法2、简化 二、完整代码三、使用示例1、局部内存管理2、支持嵌套 总结 前言 使用Flutter通过FFI调用c库的时候&#xff0c;经常需要传字符串或者一些指针变量&#xff0c;这里变量通常都是局部变量&#xff0c;在一个代码块运行…

Spock mock私有方法

mock私有方法 ‍ 被测试的方法是MiddleGroundAppListBO​类下的getPromptIdKeyAppPromptInfoMap方法 private Map<Long, AppPromptInfoModel> getPromptIdKeyAppPromptInfoMap(String cubeAppIdentity) {List<AppPromptInfoDO> promptByApp knowledgeCubeQueryR…

轻松实现服务器事件主动推送到web端!Spring SseEmitter 详解

SseEmitter 是 Spring Framework 中用于服务器发送事件&#xff08;Server-Sent Events, SSE&#xff09;的类。SSE 是一种允许服务器推送更新到客户端的技术&#xff0c;通常用于实时更新的场景&#xff0c;如股票价格、实时消息、游戏状态等&#xff0c;又或者想要实现像Chat…

Vue52-scoped样式

一、scoped样式的作用 1-1、scoped样式的作用 vue中组件的样式都是汇总到一起的。容易出现一个问题&#xff1a;类名冲突。 示例&#xff1a; school和student组件的类名都叫demo&#xff0c;则student的样式将覆盖school的样式&#xff0c;因为App.vue中&#xff0c;先引入的…

Kubernetes (K8s) 和 Spring Cloud 的区别

Kubernetes (K8s) 和 Spring Cloud 是两种常用的云原生技术&#xff0c;它们在微服务架构和云计算领域中扮演着重要的角色。尽管两者都有助于开发和部署微服务&#xff0c;但它们的功能和目标存在显著差异。本文将详细讨论 Kubernetes 和 Spring Cloud 的区别&#xff0c;从它们…

NLP主流大模型如GPT3/chatGPT/T5/PaLM/LLaMA/GLM的原理和差异有哪些-详细解读

自然语言处理&#xff08;NLP&#xff09;领域的多个大型语言模型&#xff08;如GPT-3、ChatGPT、T5、PaLM、LLaMA和GLM&#xff09;在结构和功能上有显著差异。以下是对这些模型的原理和差异的深入分析&#xff1a; GPT-3 (Generative Pre-trained Transformer 3) 虽然GPT-4…

Rocky Linux安装Docker

简介&#xff1a; Red Hat Enterprise Linux (RHEL): RHEL 是由 Red Hat 公司开发和维护的企业级操作系统。 它是基于开源社区的 Fedora 项目&#xff0c;但提供了商业支持和服务&#xff0c;面向企业用户。 RHEL 提供了稳定、可靠和高性能的操作环…

理解JSP底层

import java.net.URLDecoder;public class login_jsp{//JSP的9大内置对象private JSPWriter out;//当前JSP输出流对象private HttpServletRequest request;//请求对象private HttpServletResponse response;//响应对象private HttpSession session;//会话对象private ServletCo…

【Python数据分析】Pandas_Series如何转变为DataFrame

1.使用 pd.DataFrame()构造函数 可以使用pd.DataFrame()构造函数将 Series 转换为 DataFrame。在构造函数中&#xff0c;将 Series 作为一个列传递给 DataFrame&#xff0c;并且可以通过指定列名来为 DataFrame 的列命名。 代码示例&#xff1a; import pandas as pd data[1…

sklearn 基础教程

scikit-learn&#xff08;简称sklearn&#xff09;是一个开源的机器学习库&#xff0c;它提供了简单和有效的数据分析和数据挖掘工具。sklearn是Python语言中最重要的机器学习库之一&#xff0c;广泛用于统计学习和数据分析。 以下是scikit-learn的基础教程&#xff0c;帮助您开…

【Python高级编程】用 Matplotlib 绘制迷人的图表

用 Matplotlib 绘制迷人的图表 引言 Matplotlib 是 Python 中广泛使用的绘图库&#xff0c;用于创建各种图表和可视化。本文将逐步指导您使用 Matplotlib 绘制基本图表&#xff0c;包括折线图、条形图和散点图。 安装 Matplotlib 使用 pip 安装 Matplotlib&#xff1a; pi…

存储器的性能指标以及层次化存储器

存储器的性能指标 存储器有三个性能指标&#xff1a;速度、容量和位价&#xff08;每位价格&#xff09; 1.存储速度 &#xff08;1&#xff09;存取时间 想衡量存储速度&#xff0c;最直观的指标就是完成一次存储器读写操作所需要的时间&#xff0c;这叫做存取时间&#x…

Spring运维之boo项目表现层测试加载测试的专用配置属性以及在JUnit中启动web服务器发送虚拟请求

测试表现层的代码如何测试 加载测试的专用属性 首先写一个测试 假定我们进行测试的时候要加一些属性 要去修改一些属性 我们可以写一个只在本测试有效的测试 写在配置里 测试 打印输出 我们把配置文件里面的配置注释掉后 我们同样可以启动 package com.example.demo;impo…

【数组基础知识】

二维数组 我的理解是&#xff0c;如果内层有值&#xff0c;外层打印就是地址值。如果内层没值&#xff0c;外层打印就是null。 int[][]a new int [3][]; 这样打印a[0]的时候是null。 打印a[0][0]会报错。 int[][]a new int [3][1]; 这样打印a[0]的时候是地址值。 打印a…

分布式事务之TCC

一、 实现一个分布式事务 TCC&#xff08;Try-Confirm-Cancel&#xff09;模式是一种常见的分布式事务解决方案&#xff0c;它通过将一个事务拆分为三个阶段来实现分布式事务的一致性。下面是一个使用Java语言实现TCC模式的简单案例&#xff1a; 定义业务操作接口&#xff1a…