ES6 Class 的继承(十一)

Class 可以通过extends关键字实现继承,这比 ES5 的通过修改原型链实现继承,要清晰和方便很多。

class Point {
}
class ColorPoint extends Point {
}

继承的特性:

  • extends 关键字:使用 extends 来表示一个类继承自另一个类。
  • super 关键字:在子类的构造函数中使用 super() 调用父类的构造函数。
  • 方法重写:子类可以重写父类的方法。
  • 访问控制:子类可以访问父类的公共和受保护的成员,但不能直接访问私有成员。
  • 对象实例化:子类实例化时,首先执行父类的构造函数。
  • 原型链:子类的原型是父类的实例,子类继承了父类的原型链。

继承的用法:

  1. 使用 extends 来实现继承。
  2. 在子类的构造函数中使用 super 调用父类的构造函数。
  3. 重写父类的方法以提供新的实现。
  4. 利用原型链的特性来实现方法的继承。

1. 基本继承

class Animal {constructor(name) {this.name = name;}speak() {return `${this.name} makes a noise.`;}
}class Dog extends Animal {speak() {return `${this.name} barks.`;}
}let dog = new Dog('Rex');
console.log(dog.speak()); // 输出: Rex barks.

2. 调用父类的构造函数

class Rectangle {constructor(width, height) {this.width = width;this.height = height;}getArea() {return this.width * this.height;}
}class Square extends Rectangle {constructor(sideLength) {super(sideLength, sideLength); // 调用父类的构造函数}
}let square = new Square(5);
console.log(square.getArea()); // 输出: 25

3. 方法重写

class Person {greet() {return 'Hello';}
}class Student extends Person {greet() {return 'Hello, my name is ' + this.name;}introduce() {return `${this.greet()}, I am a student.`;}
}let student = new Student();
student.name = 'Alice';
console.log(student.introduce()); // 输出: Hello, my name is Alice, I am a student.

4. 访问父类的静态方法

class Animal {static getClassName() {return 'Animal';}
}class Dog extends Animal {static getClassName() {return super.getClassName() + ' (Dog)';}
}console.log(Dog.getClassName()); // 输出: Animal (Dog)

5. 原型链方法调用

class Vehicle {start() {console.log('Vehicle is starting.');}
}class Car extends Vehicle {start() {super.start(); // 调用父类的 start 方法console.log('Car is starting.');}
}let car = new Car();
car.start(); // 输出: Vehicle is starting. 然后 Car is starting.

6. Object.getPrototypeOf 方法可以用来从子类上获取父类。

Object.getPrototypeOf(ColorPoint) === Point
// true

可以使用这个方法判断,一个类是否继承了另一个类。

7. 类的 prototype 属性和proto属性
大多数浏览器的 ES5 实现之中,每一个对象都有 proto 属性,指向对应的构造函数的 prototype 属性。Class 作为构造函数的语法糖,同时有 prototype 属性和 proto 属性,因此同时存在两条继承链。

  • 子类的 proto 属性,表示构造函数的继承,总是指向父类。
  • 子类 prototype 属性的 proto 属性,表示方法的继承,总是指向父类的 prototype 属性。
class A {
}
class B extends A {
}
B.__proto__ === A // true
B.prototype.__proto__ === A.prototype // true
//类的继承模式
class A {
}
class B {
}
// B 的实例继承 A 的实例
Object.setPrototypeOf(B.prototype, A.prototype);
// B 继承 A 的静态属性
Object.setPrototypeOf(B, A);
const b = new B();

8. 原生构造函数的继承
原生构造函数是指语言内置的构造函数,通常用来生成数据结构。ECMAScript 的原生构造函数大致有下面这些。

Boolean()
Number()
String()
Array()
Date()
Function()
RegExp()
Error()
Object()

9. Mixin 模式的实现
Mixin 指的是多个对象合成一个新的对象,新对象具有各个组成成员的接口。它的最简单实现如下。

const a = {a: 'a'
};
const b = {b: 'b'
};
const c = {...a, ...b}; // {a: 'a', b: 'b'}

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

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

相关文章

了解Maven

一.环境搭建 如果使用的是社区版 版本要求为:2021.1-2022.1.4 如果使用的是idea专业版就无需版本要求,专业版下载私信我,免费教你下载 二,Maven 什么是Maven,也就是一个项目管理工具,用来基于pom的概念&#xff0c…

使用druid对sql进行血缘解析

实体类&#xff1a; Data public class SqlFlowEntity {/*表名称*/private String tableName;/*表操作类型*/private String type;/*涉及字段*/private List<String> columnList; } 核心代码&#xff1a; import com.alibaba.druid.sql.SQLUtils; import com.alibaba.d…

Ghidra comment add script

init # -*- coding: utf-8 -*- import re from ghidra.program.model.listing import CodeUnit# 获取当前程序和指令迭代器 program getCurrentProgram() listing program.getListing() instructionIterator listing.getInstructions(True)# 用于存储唯一的指令类型和操作数…

PostgreSQL修改最大连接数

在使用PostgreSQL 的时候&#xff0c;经常会遇到这样的错误提示&#xff0c; sorry, too many clients already&#xff0c;这是因为默认PostgreSQL最大连接数是 100, 一般情况下&#xff0c;个人使用时足够的&#xff0c;但是在生产环境&#xff0c;这个连接数是远远不够的&am…

Linux笔记之显示当前路径下文件的数量

Linux笔记之显示当前路径下文件的数量 在Linux中&#xff0c;ls -l 和 wc -l 是两个常用命令&#xff0c;分别用于列出目录内容的详细信息和计算行数。将这两个命令结合使用&#xff0c;可以快速统计目录中包含的文件和子目录的数量。 ls -l ls -l 命令用于列出目录中的内容…

python机器学习5 数据容器

Python中有几个数据容器如下&#xff1a; List&#xff0c;数组&#xff0c;如同Array数组。 Dictionarie&#xff0c;字典&#xff0c;可以通过文字来访问数据。 Sets&#xff0c;序列集&#xff0c;做数学交集、并集等计算时使用。 Tuple&#xff0c;序列&#xff0c…

Elasticsearch-多边形范围查询(8.x)

目录 一、字段设计 二、数据录入 三、查询语句 四、Java代码实现 开发版本详见&#xff1a;Elasticsearch-经纬度查询(8.x-半径查询)_es经纬度范围查询-CSDN博客 一、字段设计 PUT /aoi_points {"mappings": {"properties": {"location": {…

redis 夺命21问

1.什么是redis? Redis 是一个基于内存的高性能key-value数据库。 2.Reids的特点 Redis本质上是一个Key-Value类型的内存数据库&#xff0c;很像memcached&#xff0c;整个数据库统统加载在内存当中进行操作&#xff0c;定期通过异步操作把数据库数据flush到硬盘上进行保存。…

回归求助 教程分享

大侠幸会&#xff0c;在下全网同名「算法金」 0 基础转 AI 上岸&#xff0c;多个算法赛 Top 「日更万日&#xff0c;让更多人享受智能乐趣」 今日 217/10000 抱个拳&#xff0c;送个礼 更多内容&#xff0c;见微*公号往期文章&#xff1a;通透&#xff01;&#xff01;十大回…

NFT如何解决音乐版权的问题

音乐版权问题一直困扰着音乐产业。传统的音乐版权管理模式存在以下问题。需要注意的是&#xff0c;NFT在音乐版权领域仍处于早期发展阶段&#xff0c;存在一些需要解决的问题&#xff0c;例如技术标准不统一、应用场景有限、法律法规不明朗等。但随着技术的进步和市场的完善&am…

小程序自学教程

从0开始搭建微信小程序前后台 0、准备 如何安装&#xff1f;去CSDN搜索“xxx安装教程”即可。 &#xff08;1&#xff09;工具 IntelliJ IDEA&#xff08;必选&#xff09;——Java开发集成环境&#xff0c;可以前后端同时使用 Web Storm——web开发集成环境&#xff0c;主要…

【Dison夏令营 Day 18】如何用 Python 中的 Pygame 制作国际象棋游戏

对于 Python 中级程序员来说&#xff0c;国际象棋游戏是一个很酷的项目创意。在熟练使用类的同时&#xff0c;它也是制作图形用户界面应用程序的良好练习。在本教程中&#xff0c;您将学习到 使用 pygame 的基础知识。 学习如何使用 Python 类编码一个国际象棋游戏。 安装和设…

Mybatis防止SQL注入

防止SQL注入的中心思想就是参数化查询&#xff0c;将输入当作参数传递&#xff0c;而不是直接拼接到 SQL 语句中。 常见的防止SQL注入的方式 1、使用#{}占位符 2、使用动态SQL 3、[配置 SQL 注入过滤器](#配置 SQL 注入过滤器) 使用#{}占位符 先来看一个错误的示范${} /…

PostgreSQL的pg_dirtyread工具

PostgreSQL的pg_dirtyread工具 pg_dirtyread 是一个第三方PostgreSQL扩展&#xff0c;它允许用户读取数据库文件中的“脏”数据&#xff0c;即那些被标记为删除或不再可见的数据。这个扩展对于数据恢复和调试非常有用&#xff0c;尤其是在需要恢复被删除或更新前的数据时。 以…

33.异步FIFO IP核的配置、调用与仿真

&#xff08;1&#xff09;异步FIFO的配置过程&#xff1a; ps&#xff1a;异步fifo相比较同步fifo少一个实际深度 &#xff08;2&#xff09;异步FIFO的调用: module dcfifo (input wr_clk ,input rd_clk ,input [7:0] …

2024-07-13 Unity AI状态机2 —— 项目介绍

文章目录 1 项目介绍2 模块介绍2.1 BaseState2.2 ...State2.2.1 PatrolState2.2.2 ChaseState / AttackState / BackState 2.3 StateMachine2.4 Monster 3 其他功能4 类图 项目借鉴 B 站唐老狮 2023年直播内容。 点击前往唐老狮 B 站主页。 1 项目介绍 ​ 本项目使用 Unity 2…

金融业务系统云原生技术转型:从传统架构到云原生的跨越

引言 在数字化浪潮的推动下&#xff0c;金融行业正经历着前所未有的变革。云计算作为这场变革的核心技术之一&#xff0c;正在重塑金融机构的IT架构。云原生技术以其敏捷性、弹性和可扩展性&#xff0c;为金融业务提供了强大的技术支撑&#xff0c;使得金融机构能够快速响应市…

大话设计模式

设计模式 专栏概览 参考《大话设计模式》&#xff0c;进行深入分析理解&#xff1b;使用C实现&#xff0c;然后C采取OOP仿照实现&#xff1b;C不是不能OOP,只是底层支持没那么好&#xff0c;所以C代码部分只是推荐参考&#xff1b;关于C的OOP推荐书籍&#xff1a;周立功的《嵌…

防火墙NAT和智能选路实验详解(华为)

目录 实验概述实验拓扑实验要求要求一要求二要求三要求四要求五 实验概述 从我上面一个博客能够了解到NAT和防火墙选路原理 ——>防火墙nat和智能选路&#xff0c;这一章我通过实验来详解防火墙关于nat和智能选路从而能熟练使用和配置防火墙&#xff0c;这里使用的是华为US…

《Cross-Image Pixel Contrasting for Semantic Segmentation》论文解读

期刊&#xff1a;TPAMI 年份&#xff1a;2024 摘要 研究图像语义分割问题。目前的方法主要集中在通过专门设计的上下文聚合模块(如空洞卷积、神经注意力)或结构感知的优化目标(如iou样损失)挖掘"局部"上下文&#xff0c;即单个图像中像素之间的依赖关系。然而&…