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

ES6的面向对象编程以及ES6中的类和对象

一、面向对象

1、面向对象

(1)是一种开发思想,并不是具体的一种技术

(2)一切事物均为对象,在项目中主要是对象的分工协作

2、对象的特征

(1)对象是属性和行为的结合体

(2)属性:体现对象的静态特征、

(3)行为:体现对象的动态特征(具体体现为函数/方法)

3、面向对象的三大特征

(1)封装性:对象时属性和行为的封装体

(2)继承性:在基类(父类)中已经定义的属性或行为,子类可以继承使用

(3)多态性:同一个信息传递给不同的对象呈现的效果也是不同的

二、ES6中的类和对象

1、类:在ES6中引入类的概念,使用class关键字进行定义

class 类名{

        属性

        方法

}

2、ES6中类和对象的关系

(1)类是对象的抽象:类抽取了对象的公共部分

(2)对象是类的实例化:对象是类的具体实例

3、ES6中类的构造函数

使用constructor作为类的构造函数,用于初始化对象。在定义类的时候若没有显式的定义constructor,js会自动生成一个无参的构造函数(constructor(){}) 

 class Student{constructor(id,name,age,sex){   //constructor用来初始化对象的属性this.id = id,this.name = name,this.age = age,this.sex = sex}show(){console.log(`学号:${this.id} 姓名:${this.name} 年龄:${this.age} 性别:${this.sex}`);}
}
let stu1 = new Student('001','小王',20,'男');
console.log(stu1);
stu1.show();

 

 注:通过类创建对象,new 类名([参数])

(1)创建对象时不能显式调用constructor,在new 类名()创建对象时,默认调用了constructor

(2)在定义类时若没有写constructor,则js会自动生成无参的constructor

三、ES6中类的继承

1、基类:被继承的类,也可称为父类或超类

2、子类:由基类派生的类,又称为派生类

3、继承的用法:通过extends关键字实现

class 父类名{

        构造方法

        普通方法

}

class 子类名 extends 父类名{

        构造方法

        普通方法

}

4、super关键字:代表是父类,在类的继承过程中访问父类的构造函数、普通函数

class Father{constructor(name,sex){this.name= name,this.sex = sex}display(){console.log(`姓名:${this.name} 性别:${this.sex}`);}
}class Son extends Father{constructor(name,sex,address,phone){super(name,sex),this.address = address,this.phone = phone}show(){console.log(`姓名:${this.name} 性别:${this.sex} 地址:${this.address} 电话:${this.phone}`);}
}let son1 = new Son('小黑','男','西安','13198302930')
son1.show();

5、子类的普通方法与父类的普通方法同名时,子类方法覆盖父类的方法

类中的普通方法又称为实例方法或成员方法

        class Animal{eat(food){console.log(`${food}`);}sleep(){console.log('在睡觉');}}class Rabbit extends Animal{eat(){super.eat('兔子吃草')}}class Tiger extends Animal{eat(){super.eat('老虎吃肉')}}let rabbit = new Rabbit()rabbit.eat();rabbit.sleep();let tiger = new Tiger();tiger.eat();tiger.sleep();

相关文章:

ES6的面向对象编程以及ES6中的类和对象

一、面向对象 1、面向对象 (1)是一种开发思想,并不是具体的一种技术 (2)一切事物均为对象,在项目中主要是对象的分工协作 2、对象的特征 (1)对象是属性和行为的结合体 &#x…...

ConfigMaps in K8s

摘要 ConfigMaps是Kubernetes(K8s)中用于存储应用程序配置信息的一种资源对象。它将key-value对存储为Kubernetes集群中的一个资源,并可以在Pod中以卷或环境变量的形式使用。 ConfigMaps的设计目的是将应用程序配置与应用程序本身解耦。它可…...

《机器人学一(Robotics(1))》_台大林沛群 第 6 周 【轨迹规划_直线转折处抛物线平滑】Quiz 6

步骤: 1、 编程 将PPT 的例子 跑一遍, 确保代码无误 2、根据题目 修改 相关参数 文章目录 求解代码_Python 解决的问题: 线段间转折点 的 速度 不连续 解决方法: 将直线段 两端 修正为 二次方程式 二次项圆滑 求解代码_Python …...

关于vscode的GitLens插件里的FILE HISTORY理解

最近在用vscode的GitLens插件开发项目遇到这个疑问,先看图: 每当我点击FILE HISTORY 一个commit时,正常来说显示器会自动将点击的提交版本和它上一个提交版本进行比较,如果单纯这么理解的话就错了,因为GitLens的File …...

通过idea实现springboot集成mybatys

概述 使用springboot 集成 mybatys后,通过http请求接口,使得通过http请求可以直接直接操作数据库; 完成后端功能框架;前端是准备上小程序,调用https的请求接口用。简单实现后端框架; 详细 springboot 集…...

力扣(LeetCode)算法_C++——移位字符串分组

给定一个字符串,对该字符串可以进行 “移位” 的操作,也就是将字符串中每个字母都变为其在字母表中后续的字母,比如:“abc” -> “bcd”。这样,我们可以持续进行 “移位” 操作,从而生成如下移位序列&am…...

Vue2 与Vue3的区别?面试题

Vue 2和Vue 3是Vue.js框架的不同版本,在面试中经常涉及到它们之间的区别。以下是Vue 2和Vue 3的主要区别: 性能提升:Vue 3在性能方面进行了优化。Vue 3引入了更高效的Diff算法,提高了渲染性能。此外,Vue 3还进行了代码…...

java代码:Random和Scanner应用的小例子-猜数字小游戏

//java代码:Random和Scanner应用的小例子-猜数字小游戏 package com.test; import java.util.Random; import java.util.Scanner; /* * 需求:猜数字小游戏。 * 系统产生一个1-100之间的随机数,请猜出这个数据是多少? * * 分析…...

python调用git出错:ImportError: Failed to initialize: Bad git executable.

报错信息 #报错信息 Traceback (most recent call last): File “”, line 1, in File “C:\Python27\lib\site-packages\git_init_.py”, line 85, in raise ImportError(‘Failed to initialize: {0}’.format(exc)) ImportError: Failed to initialize: Bad git executab…...

【C语言】入门——指针

目录 ​编辑 1.指针是什么 2.指针类型和指针运算 2.1指针-整数 2.2指针-指针 2.3指针的关系运算 3.野指针 3.1野指针成因 👍指针未初始化: 👍指针越界访问: 👍指针指向空间释放: 3.2如何规避野指针 …...

C#_预处理指令

1. 预处理器指令指导编译器在实际编译开始之前对信息进行预处理。 所有的预处理器指令都是以 # 开始。且在一行上,只有空白字符可以出现在预处理器指令之前。预处理器指令不是语句,所以它们不以分号(;)结束。 C# 编译器没有一个单…...

容器命令(docker)

文章目录 前言一、docker容器命令0、准备工作1、新建容器并启动2、退出容器3、列出所有的运行的容器4、删除容器5、启动和停止容器的操作 总结 前言 本文主要介绍docker中与容器相关的一些命令,是对狂神课程的一些总结,作为一个手册帮助博主和使用docke…...

Vue3 ElementPlus el-cascader级联选择器动态加载数据

参考了这位的大佬的写法 element el-cascader动态加载数据 &#xff08;多级联动&#xff0c;落地实现&#xff09;_el-cascader 动态加载_林邵晨的博客-CSDN博客 <el-cascader style"width: 300px" :props"address" v-model"addressValue" …...

leetcode分类刷题:栈(Stack)(一、字符串相邻元素删除类型)

1、在leetcode分类刷题&#xff1a;基于数组的双指针&#xff08;一、基于元素移除的O(1)类型&#xff09;题目中&#xff0c;采用双指针之快慢指针的算法来解决。 2、字符串相邻元素的删除问题&#xff0c;用栈来进行管理&#xff0c;会非常有效&#xff1b;这种题型排在后面的…...

你还在找淘宝商品信息查询的接口吗?

你还在找淘宝商品信息查询的接口吗&#xff1f;&#xff0c;不用找了&#xff0c;我这有&#xff0c;免费测试 在很多行业&#xff0c;比如淘客、商品采集、刊登、数据分析行业都需要用到相关的商品接口&#xff0c;但是官方一般又没有开放这些接口&#xff0c;怎么办&#xff…...

dll修复精灵,dll修复工具下载方法分享,mfc140u.dll缺失损坏一键修复

今天&#xff0c;我将为大家分享一个关于mfc140u.dll的问题。首先&#xff0c;我想问一下在座的网友们&#xff0c;有多少人知道mfc140u.dll是什么&#xff1f;又有多少人知道它的作用以及如何解决这个问题呢&#xff1f;在接下来的演讲中&#xff0c;我将详细介绍mfc140u.dll的…...

[LINUX使用] iptables tcpdump

iptables: 收到来自 10.10.10.10 的数据后都丢弃 iptables -I INPUT -s 10.10.10.10 -j DROP 直接 reject 来自 10.10.10.* 网段的数据 iptables -I INPUT -s 10.10.10.0/24 -j REJECT tcpdump: dump eth0的数据到本地 tcpdump -i eth0 -w dump.pcap 只抓 目的地址是 10…...

百度文心一率先言向全社会开放 应用商店搜“文心一言”可直接下载

8月31日&#xff0c;文心一言率先向全社会全面开放。广大用户可以在应用商店下载“文心一言APP”或登陆“文心一言官网”&#xff08;https://yiyan.baidu.com&#xff09; 体验。同时&#xff0c;企业用户可以直接登录百度智能云千帆大模型平台官网&#xff0c;调用文心一言能…...

【100天精通Python】Day56:Python 数据分析_Pandas数据清洗和处理

目录 数据清洗和处理 1.处理缺失值 1.1 删除缺失值&#xff1a; 1.2 填充缺失值&#xff1a; 1.3 插值&#xff1a; 2 数据类型转换 2.1 数据类型转换 2.2 日期和时间的转换&#xff1a; 2.3 分类数据的转换&#xff1a; 2.4 自定义数据类型的转换&#xff1a; 3 数…...

【vue】使用无障碍工具条(详细)

引入&#xff1a;使用的是太阳湾的无障碍工具条&#xff0c;代码地址&#xff1a;https://gitee.com/tywAmblyopia/ToolsUI 具体步骤&#xff1a;下载代码后&#xff0c;将其中的 canyou 文件夹拖入 vue 项目中的 public 文件夹中&#xff1b; 上图是在项目目录中的样子&#…...

MySQL 隔离级别:脏读、幻读及不可重复读的原理与示例

一、MySQL 隔离级别 MySQL 提供了四种隔离级别,用于控制事务之间的并发访问以及数据的可见性,不同隔离级别对脏读、幻读、不可重复读这几种并发数据问题有着不同的处理方式,具体如下: 隔离级别脏读不可重复读幻读性能特点及锁机制读未提交(READ UNCOMMITTED)允许出现允许…...

微信小程序云开发平台MySQL的连接方式

注&#xff1a;微信小程序云开发平台指的是腾讯云开发 先给结论&#xff1a;微信小程序云开发平台的MySQL&#xff0c;无法通过获取数据库连接信息的方式进行连接&#xff0c;连接只能通过云开发的SDK连接&#xff0c;具体要参考官方文档&#xff1a; 为什么&#xff1f; 因为…...

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

NXP S32K146 T-Box 携手 SD NAND(贴片式TF卡):驱动汽车智能革新的黄金组合

在汽车智能化的汹涌浪潮中&#xff0c;车辆不再仅仅是传统的交通工具&#xff0c;而是逐步演变为高度智能的移动终端。这一转变的核心支撑&#xff0c;来自于车内关键技术的深度融合与协同创新。车载远程信息处理盒&#xff08;T-Box&#xff09;方案&#xff1a;NXP S32K146 与…...

JavaScript基础-API 和 Web API

在学习JavaScript的过程中&#xff0c;理解API&#xff08;应用程序接口&#xff09;和Web API的概念及其应用是非常重要的。这些工具极大地扩展了JavaScript的功能&#xff0c;使得开发者能够创建出功能丰富、交互性强的Web应用程序。本文将深入探讨JavaScript中的API与Web AP…...

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

vue3 daterange正则踩坑

<el-form-item label"空置时间" prop"vacantTime"> <el-date-picker v-model"form.vacantTime" type"daterange" start-placeholder"开始日期" end-placeholder"结束日期" clearable :editable"fal…...

ui框架-文件列表展示

ui框架-文件列表展示 介绍 UI框架的文件列表展示组件&#xff0c;可以展示文件夹&#xff0c;支持列表展示和图标展示模式。组件提供了丰富的功能和可配置选项&#xff0c;适用于文件管理、文件上传等场景。 功能特性 支持列表模式和网格模式的切换展示支持文件和文件夹的层…...

算法—栈系列

一&#xff1a;删除字符串中的所有相邻重复项 class Solution { public:string removeDuplicates(string s) {stack<char> st;for(int i 0; i < s.size(); i){char target s[i];if(!st.empty() && target st.top())st.pop();elsest.push(s[i]);}string ret…...

Windows 下端口占用排查与释放全攻略

Windows 下端口占用排查与释放全攻略​ 在开发和运维过程中&#xff0c;经常会遇到端口被占用的问题&#xff08;如 8080、3306 等常用端口&#xff09;。本文将详细介绍如何通过命令行和图形化界面快速定位并释放被占用的端口&#xff0c;帮助你高效解决此类问题。​ 一、准…...