ES6学习笔记(九)——class(类)

news2024/9/21 20:49:29

1. 封装

传统面向对象的编程序语言都是【类】的概念,对象都是由类创建出来,然而早期 JavaScript 中是没有类的,面向对象大多都是基于构造函数和原型实现的,但是 ECMAScript 6 规范开始增加了【类】相关的语法,使得 JavaScript 中的面向对象实现方式更加标准。

class(类)是 ECMAScript 6 中新增的关键字,专门用于创建类的,类可被用于实现逻辑的封装。

// 创建类  
class Person {    
// 此处编写封装逻辑  
}  
// 实例化  
let p1 = new Person()  
console.log(p1)

1.1 实例成员

// 创建类
class Person {
  // 实例属性
  name = '小明';
  
  // 实例方法
  sleep () {
    console.log('sleeping...')
  }
}
  
// 实例化
let p1 = new Person();
p1.sayHi();

总结:

  • 关键字 class 封装了所有的实例属性和方法

  • 类中封装的并不是变量和函数,因此不能使用关键字 letconst var

1.2 静态成员

// 创建类
class Person {
  // 静态属性
  static version = '1.0.0';

  // 静态方法
  static getVersion = function () {
    console.log(this.version);
  }
}
	
// 静态方法直接访问
console.log(Person.version);
Person.getVersion();

总结:

  • static 关键字用于声明静态属性和方法

  • 静态属性和方法直接通过类名进行访问

1.3 构造函数

创建类时在类的内部有一个特定的方法 constructor ,该方法会在类被实例化时自动被调用,常被用于处理一些初始化的操作。

class Person {
  // 实例化时 立即执行
  // 构造函数、构造方法、构造器
  constructor (name, age) {
    this.name = name;
    this.age = age;
  }
// 实例方法
  walk () {
    console.log(this.name + '正在走路...');
  }
}

// 实例化
let p1 = new Person('小明', 18);
p1.walk();

总结:

  • constructor 是类中固定的方法名
  • constructor 方法在实例化时立即执行
  • constructor 方法接收实例化时传入的参数
  • constructor 并非是类中必须要存在的方法

2. 继承

2.1 extends

extends 是 ECMAScript 6 中实现继承的简洁语法,代码如下所示:

class Person {
  // 父类的属性
  legs = 2;
  arms = 2;
  eyes = 2;
  // 父类的方法
  walk () {
    console.log('人类都会走路...');
  }
  // 父类的方法
  sleep () {
    console.log('人都得要睡觉...');
  }
}

// Chinese 继承了 Person 的所有特征
class Chinese extends Person {}

// 实例化
let c1 = new Chinese();
c1.walk();

如上代码所示 extends 是专门用于实现继承的语法关键字,Person 称为父类、Chinese 称为子类。

2.2 super

在继承的过程中子类中 constructor 中必须调 super 函数,否则会有语法错误,如下代码所示:

class Person {
  // 构造函数
  constructor (name, age) {
    this.name = name;
    this.age = age;
  }
  
  // 父类的属性
  legs = 2;
  arms = 2;

  walk () {
    console.log('人类都会走路...');
  }
}

// 子类 English 继承了父类 Person
class English extends Person {
  // 子类的构造函数
  constructor (name, age) {
    super(name, age);
  }

  // 子类的属性
  skin = 'white';
  language = '英文';
  }

// 实例化
let e1 = new English('jack', 18);
console.log(e1.name);

子类构造函数中的 super 函数的作用是可以将子类实例化时获得的参数传入父类的构造函数之中。

ECMAScript 6 中基于类的面向对象相较于构造函数和原型对象的面向对象本质上是一样的,基于类的语法更为简洁,未来的 JavaScript 中也都会是基于类的语法实现,当前阶段先熟悉基于类的语法,后面课程中会加强基于类语法的实践。

3. JavaScript 中逗号与分号的问题

  • 分号
    • JavaScript 中分号 ; 代表了一个语句的结束,JavaScript 默认将换行符当做了分号,所以可以省略不写
  • 对象为什么用逗号,而不是分号?

    • 因为对象 p 里的 属性: 属性值 不是一个语句,一整个 let p = {} 才是一个语句,所以最后用的是分号(;)结尾

    • 如果 属性: 属性值, 后面还有 属性2: 属性值2,的话,如果省略了逗号,那么 JavaScript 就会默认将换行符当做了分号,所以就会报错。

  • 函数、构造函数、class 类里为什么又用分号呢?
    • 函数体的每一行就是一条执行语句,所以使用分号,JavaScript 默认将换行符当做了分号,所以可以省略不写。
    • 构造函数也是函数,所以同理。
    • class 类相当于构造函数,里面的每一个行都相当于一个语句,所以使用分号(;),JavaScript 默认将换行符当做了分号,所以也可以省略不写。

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

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

相关文章

虚幻5|AI视力系统,听力系统,预测系统(1)视力系统

继宠物伴随系统初步篇后续 虚幻5|AI巡逻宠物伴随及定点巡逻—初步篇-CSDN博客 一,听力系统 1.打开宠物ai的角色蓝图 2.选中ai感知组件 右侧细节,找到ai感知,添加感知配置,我们需要的是ai视力配置 3.选中左侧创建的ai感知组件&…

CLRerNet推理详解及部署实现(上)

目录 前言1. 概述2. 环境配置3. Demo测试4. ONNX导出初探5. ONNX导出优化6. ONNX导出总结结语下载链接参考 前言 继续我们的车道线检测任务,之前我们分享了基于 anchor 的 LaneATT 模型以及 CVPR2022 的 SOTA 方案 CLRNet,这里我们分享 WACV2024 中的一个…

如何在Linux系统上使用ONLYOFFICE文档编辑PDF文件

​对Linux用户来说,得益于各类免费PDF编辑器,编辑PDF文件从来都不是无解难题。 如果您需要为PDF文件添加注释、留下批注、编辑已有文本或添加新文本框、插入图片或形状、删除某些页面或永久删除页面,您始终可以找到合适的应用,轻…

有关JavaScript的函数定义和函数的两种声明方式

1.函数 函数是一段可重复执行的代码块,它可以接收参数,并返回结果。在JavaScript中,函数用于封装可重用的代码,提高代码的可读性和可维护性。 1.1 函数的定义 函数的定义包括以下几个部分: 函数名称:用…

Hive3:表性能优化-分区与分桶

一、分区 1、概念 我们知道,一个Hive表,对应的HDFS是一个文件夹。 那么,当数据非常多的时候,存放在一个文件夹中,后期进行查询操作会影响性能。 所以,Hive引入了分区管理的方式。 本质就是,在…

Datawhale X 魔搭 AI夏令营-AIGC方向-LoRA学习笔记

LoRA(Low-Rank Adaptation)是一种用于优化大规模预训练模型的微调技术,特别适用于在资源有限的情况下,对模型进行高效且低成本的微调。LoRA的核心思想是通过低秩分解方法,仅微调模型的少数参数,从而显著减少…

关于图像亮度相关的调试总结

1、问题背景 关于图像亮度的调试,是整个ISP中非常重要的一块,它决定了图像整体的亮度、对比度、细节、以及噪声,对人眼有非常直观的感受, 之前也就具体问题,整理过几篇图像亮度模块相关的调试总结: 关于图…

标题中有多少个字符(c语言)

1.//描述 //凯刚写了一篇美妙的作文,请问这篇作文的标题中有多少个字符? //注意:标题中可能包含大、小写英文字母、数字字符、空格和换行符。统计标题字 符数时,空格和换行符不计算在内。 //输入描述: //输入文件只有一…

【12】KMP和Manacher算法

目录 一.KMP算法解决的问题 二.Manacher算法解决的问题 基本概念 优化 一.KMP算法解决的问题 暴力求解复杂度O(N*M) next数组:next[i]表示arr[0...i-1]的前缀和后缀的最长公共长度。 Y位置失败,将前缀和后缀完全匹配,将前缀的部分和后缀对…

软件测试---接口自动化

一、pythonrequests模块 (1)requests全局观 安装:pip install requests 1.发送请求 ①requests.get() 发送get请求 ②requests.post() 发送post请求 data和json的区别:取绝于你需要传递的参数的类型。 files:文件上…

大学成长之路:如何从烧锅炉的逆袭成为FPGA大厂高管

如何从烧锅炉的逆袭成为FPGA大厂Sales Director 在即将到来的开学季,很多学子从高中生成为一个大学生,走入新的征程。大学生涯是人生的一个非常重要的阶段,如何度过大学4年的时光,并学有所成,是很多大学新生和家长思考…

Spring IoCDI(下)—DI的尾声

我们之前学习了控制反转IoC,接下来就开始学习依赖注入DI的细节。 依赖注入是一个过程,是指IoC容器在创建Bean时,去提供运行时所依赖的资源,而资源指的就是对象。我们使用 Autowired 注解,完成依赖注入的操作。简单来说…

AMBA-CHI协议详解(六)

AMBA-CHI协议详解(一) AMBA-CHI协议详解(二) AMBA-CHI协议详解(三) AMBA-CHI协议详解(四) AMBA-CHI协议详解(五) AMBA-CHI协议详解(六&#xff09…

JavaSocket编程+JDBC实战技术

一、JavaSocket编程 1.1HTTP协议 后端原理 2. 特点 同步:就是两个任务执行的过程中,其中一个任务要等另一个任务完成某各阶段性工作才能继续执行,如厨师A炒番茄,将葱花放入锅中,然后需要放入番茄,但是厨…

【自动驾驶】控制算法(二)三大坐标系与车辆运动学模型

写在前面: 🌟 欢迎光临 清流君 的博客小天地,这里是我分享技术与心得的温馨角落。📝 个人主页:清流君_CSDN博客,期待与您一同探索 移动机器人 领域的无限可能。 🔍 本文系 清流君 原创之作&…

Dubbo服务自动Web化之路

本文字数:6047字 预计阅读时间:40分钟 01 故障出现 事情起源于一次故障,2023年12月14日14点26分,大量Dubbo服务报出异常,无法链接zookeeper集群: Session 0x0 for server dubboZk.xxx.com/10.x.x.x:2181, C…

【高校科研前沿】南方科技大学冯炼教授等人在遥感顶刊RSE发文:全球人类改造的基塘系统制图

1.文章简介 论文名称:Global mapping of human-transformed dike-pond systems(全球人类改造的基塘系统制图) 第一作者及单位:Yang Xu(南方科技大学环境学院) 第一通讯作者及单位:冯炼&#x…

机器学习:线性回归算法(一元和多元回归代码)

1、线性回归 1、数据准备: 描述如何获取和准备数据。 2、图像预处理: 包括图像读取。 3、将数据划分为训练集和测试集。 4、计算数据的相关系数矩阵。 5、模型训练: 详细说明如何使用线性回归算法训练模型&…

京东2025届秋招 算法开发工程师 第2批笔试

目录 1. 第一题2. 第二题3. 第三题 ⏰ 时间:2024/08/17 🔄 输入输出:ACM格式 ⏳ 时长:2h 本试卷还有选择题部分,但这部分比较简单就不再展示。 1. 第一题 村子里有一些桩子,从左到右高度依次为 1 , 1 2…

达梦数据库的系统视图v$reserved_words

达梦数据库的系统视图v$reserved_words 达梦数据库(DM Database)提供了一系列系统视图以帮助管理员和开发人员了解数据库的状态和配置。V$RESERVED_WORDS 是其中一个系统视图,它显示了数据库系统中已保留的关键字。这些关键字在SQL语句中具有…