【ES6】—类与继承

news2024/12/25 12:24:07

在这里插入图片描述

一、 定义类

class People {
	constructor (name, age) {
		this.name = name
		this.age = age
	}
	showName () {
		console.log(this.name)
	}
}
let p1  = new People('xiaoxiao', 30)
console.log(p1)
// People {name: 'xiaoxiao', age: 30}

小节:

  1. 使用class关键字声明类
  2. 使用constructor 构造器声明动态属性
  3. 在类的第一层级声明动态方法

二、 继承类的动态属性和方法

class People {
	constructor (name, age) {
		this.name = name
		this.age = age
	}
	showName () {
		console.log(this.name)
	}
}
let p1  = new People('xiaoxiao', 30)
console.log(p1)
// People {name: 'xiaoxiao', age: 30}

class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
let c1 = new Coder('xiaoxiao', 18, '小米')
console.log(c1)
c1.showName()
c1.showCompany()

小节:
继承类的声明: class + 子类名 + extends + 父类名
动态属性接收继承:construtor + super (需要被继承的属性)
动态方法的继承: 根据子类继承父类自动继承
子类调用父类的动态方法: 实例. 方法名

三、顶层属性设置与获取

class People {
	constructor (name, age){
		this.name = name
		this.age = age
		this._sex = -1 // 0 : 男, 1: 女
	}
	get sex () {
		if (this._sex === 0) {
			return '男'
		} else if (this._sex === 1) {
			return '女'
		} else {
			return 'error'
		}
		
	}
	set sex (value) {
		if (value === 0 || value === 1) {
			this._sex = value
		}
	}
}
let p1 = new People ('xiaoxiao', 18)
p1.sex = 1
console.log(p1.sex)

class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
let c1 = new Coder('张三',20, '腾讯')
c1.sex = 0
console.log(c1.sex)

小节:

  1. 顶层属性通过 中间值声明变量、设置变量、获取变量来实现
  2. 顶层属性和构造函数的属性区别在于,顶层属性可以处理业务逻辑,并在类里面的第一层; 构造函数属性无法处理业务逻辑,并在构造器里面的第一层
  3. 顶层属性会自动被子类继承,构造函数的属性,需要手动使用super 关键字接收继承

四、静态方法和静态属性

1.静态方法

class People {
	constuctor (name, age) {
		this.name = name
		this.age = age
	}
	static say () {
		return '你好'
	}
}
let p1 = new People ('xiaoxiao', 18)
console.log(People.say())
// 你好
class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
console.log(Coder.say())
// 你好

小节:
静态方法声明:再类第一个层级使用static关键字声明
静态方法调用:使用类名.方法名 调用
子类自动继承父类的静态方法,使用子类名.方法名调用

2. 静态属性

class People {
	constuctor (name, age) {
		this.name = name
		this.age = age
	}
}
People.count = 1
console.log('父类静态属性', People.count)
class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
console.log('子类继承父类的静态属性', Coder.count)

小节:
静态属性声明:类名.属性名 = 值
静态属性调用: 类名.属性名
子类继承父类: class 子类名 extends 父类名
子类调用继承静态属性: 子类.属性名

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

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

相关文章

【校招VIP】前端算法考察之排序

考点介绍: 不同的场景中,不同的排序算法执行效率不同。 稳定:冒泡、插入、归并 不稳定:选择、快速、堆排序、希尔排序 『前端算法考察之排序』相关题目及解析内容可点击文章末尾链接查看! 一、考点题目 1、使用js实…

智慧工厂解决方案:推动制造业转型升级的新引擎

随着信息技术的迅猛发展和制造业竞争的加剧,智慧工厂成为了推动制造业转型升级的重要引擎。智慧工厂解决方案通过整合物联网、人工智能、大数据分析等先进技术,实现生产过程的智能化、自动化和高效化,为企业提供了更加灵活、智能的生产模式和…

网页接口导入postman进行接口请求

postman版本:v10.17.4 一、拷贝接口信息 网页打开开发者工具-networkk,在网页上请求一次接口,鼠标指在接口上,点击鼠标右键-copy-copy as cURL(bash) 二、导入postman 打开postman,点击import-Raw text,…

Java简便集成工作流(activiti),通用审批系统

前言 activiti工作流引擎项目,企业erp、oa、hr、crm等企事业办公系统轻松落地,请假审批demo从流程绘制到审批结束实例。 一、项目形式 springbootvueactiviti集成了activiti在线编辑器,流行的前后端分离部署开发模式,快速开发平…

Nelson-Siegel-Svensson in Python;使用纳尔逊-西格尔-斯文森估计即期汇率曲线(1994)

一、说明 Nelson-Siegel-Svensson (1994) 模型通过添加 1987 个额外的曲线估计参数来修改 Nelson-Siegel (2) 模型。虚拟任何收益率曲线形状都可以使用这两种模型进行插值,这两种模型在世界各地的银行中广泛使用。 图1…

oracle19c-静默安装(centos7)

目录 一.环境准备1.关闭防火墙2.关闭SELINUX3.配置本地yum源4.安装ORACLE先决条件的软件包5.修改LINUX的内核文件6.添加下列参数到/etc/security/limits.conf7.添加下列条目到/etc/pam.d/login8.环境变量中添加下列语句9.创建文件目录和相应的用户10.配置oracle用户的环境变量1…

CSPM是什么证书?有啥用?

重要的事情说三遍!!! CSPM开始报名!CSPM开始报名!CSPM开始报名! 今天给大家介绍一个新的项目管理国标证书(CSPM)——项目管理专业人员能力评价等级证书。下面我将从以下6个方面详细…

长胜证券:为什么股票分红后下跌?分红是好事吗?

股票分红是上市公司回报股东的一种方法,其也会影响股票的价格走势。那么为什么股票分红后跌落?分红是功德吗?港陆证券也为我们准备了相关内容,以供参考。 为什么股票分红后跌落? 1、市场机制调节,股票分红…

QNAP(威联通)NAS外远程访问指南,免费内网穿透工具的应用和配置指导——“cpolar内网穿透”

文章目录 前言1. 威联通安装cpolar内网穿透2. 内网穿透2.1 创建隧道2.2 测试公网远程访问 3. 配置固定二级子域名3.1 保留二级子域名3.2 配置二级子域名 4. 使用固定二级子域名远程访问 前言 购入威联通NAS后,很多用户对于如何在外在公网环境下的远程访问威联通NAS…

AdMob无效流量问题,如何预防及解决?

AdMob是Google推出的移动广告平台,开发者可以集成AdMob SDK广告到应用中获得收入,并使用 AdMob 的工具和功能来管理广告展示和优化收入。 很多开发者在使用AdMob平台时,可能会遇到无效流量的警告,尤其是对刚刚使用的用户来说&…

58从零开始学Java之String字符串常量池和intern方法

作者:孙玉昌,昵称【一一哥】,另外【壹壹哥】也是我哦 千锋教育高级教研员、CSDN博客专家、万粉博主、阿里云专家博主、掘金优质作者 前言 在之前的文章中,壹哥给大家介绍了String字符串的不可变性及其实现原理,其中给…

Springboot 配置使用 Kafka

Springboot 配置使用 Kafka 前言一、Linux 安装 Kafka二、构建项目三、引入依赖四、配置文件生产者yml 方式Config 方式 消费者yml 方式Config 方式 五、开始写代码生产者发送成功回调和异常处理 消费者接收异常处理 七、开始测试测试普通单条消息测试消费者异常处理测试延时消…

【JAVA基础——final关键字】

JAVA基础 final 关键字 文章目录 JAVA基础概述final修饰类final修饰方法final修饰变量非final类内 final修饰的方法和变量可以被继承类调用 概述 在 Java 中,final 是一个关键字,用于修饰类、方法和变量。 final 类: 不可被继承。final 常…

Linux用户与组管理(02)(七)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 目录 前言 一、批量创建 二、修改属性 三、密码设置 四、删除 总结 前言 今天学习的是上次剩余的用户组的内容,也是相对于刚学习Linux系统比较重要的部分&#x…

人民日报--全站图文数据库信息采集

支持2020-2023所有图文数据采集 #!/usr/bin/python3 # -*- coding:utf-8 -*- import requests import re from lxml import etree from sdk.utils.util_decorate import retryretry(retry3,sleep5) def get_html(url):response requests.get(url)response.encoding "u…

Leetcode刷题笔记--Hot31-40

1--颜色分类&#xff08;75&#xff09; 主要思路&#xff1a; 快排 #include <iostream> #include <vector>class Solution { public:void sortColors(std::vector<int>& nums) {quicksort(nums, 0, nums.size()-1);}void quicksort(std::vector<int…

Java虚拟机

文章目录 JVM运行时数据区域HotSpot虚拟机对象探秘实战&#xff1a;OutOfMemoryError异常 JVM 运行时数据区域 HotSpot虚拟机对象探秘 实战&#xff1a;OutOfMemoryError异常

01-6W2H方法

前言&#xff1a;6W2H法是我们制定策略时的黄金策略&#xff0c;并有不同的衍生版本&#xff0c;比如5W1H、3W1H等等&#xff0c;都是结合实际情况进行的剪裁运用。通过6W2H思想方法来进行研发管理以及问题分析&#xff0c;具备清晰的思路。 脑图&#xff1a;//参考

【Flutter】Flutter 使用 flex_color_scheme 创建美观的 Material Design 主题

【Flutter】Flutter 使用 flex_color_scheme 创建美观的 Material Design 主题 文章目录 一、前言二、FlexColorScheme 简介三、开始使用 FlexColorScheme四、实际业务中的应用五、FlexColorScheme 的高级功能六、完整实际业务代码示例七、总结 一、前言 今天&#xff0c;我想…

【算法刷题之字符串篇】

目录 1.leetcode-344. 反转字符串&#xff08;1&#xff09;方法&#xff1a;双指针 2.leetcode-541. 反转字符串 II&#xff08;1&#xff09;方法一&#xff1a;模拟&#xff08;2&#xff09;方法二&#xff1a;双指针 3.leetcode-剑指 Offer 05. 替换空格&#xff08;1&…