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

【JS】类 class

【JS】类 class

        • 定义类
        • 类的方法
        • 类继承
        • 静态方法

类(class)是用于创建对象的模板。

我们使用 class 关键字来创建一个类,类体在一对大括号 {} 中,我们可以在大括号 {} 中定义类成员的位置,如方法或构造函数。

每个类中包含了一个特殊的方法 constructor(),它是类的构造函数。

这种方法用于创建和初始化一个由 class 创建的对象。

定义类

函数声明和类声明之间的一个重要区别在于, 函数声明会提升,类声明不会

你首先需要声明你的类,然后再访问它,否则类似以下的代码将抛出 ReferenceError:

创建一个类的语法格式如下:

// name 是类的名称
// params 是实例化时穿的参数class name {constructor(params) {}
}

栗子:

// 定义一个名字为 Boy 的类
class Boy {constructor(name, age) {this.name = name;this.age = age;}
}// 使用 new 关键字来创建对象:创建对象时会自动调用构造函数方法 constructor()
let xiaomage = new Boy('小马哥', 30); // { name: '小马哥', age: 30 }
let maliao = new Boy('马立奥', 3); // { name: '马立奥', age: 3 }

在这里插入图片描述

构造方法 constructor 是一种特殊的方法:

  • 构造方法名为 constructor()。
  • 构造方法在创建新对象时会自动执行。
  • 构造方法用于初始化对象属性。
  • 如果不定义构造方法,JavaScript 会自动添加一个空的构造方法。

类的方法

我们使用关键字 class 创建一个类,可以添加一个 constructor() 方法,然后添加任意数量的方法。

class ClassName {constructor() { ... }method_1() { ... }method_2() { ... }method_3() { ... }
}

以下实例创建一个 “say” 方法:

class Boy {constructor(name, age) {this.name = name;this.age = age;}say() {return '干啥'}
}let maliao = new Boy('马立奥', 3);
let say = maliao.say();
console.log(say); // 干啥

还可以向类的方法传递参数

class Boy {constructor(name, age) {this.name = name;this.age = age;}say(data) {return '干啥,' + data;}
}let maliao = new Boy('马立奥', 3);
let say = maliao.say('我是马立奥');
console.log(say); // 干啥,我是马立奥

在这里插入图片描述

class Boy {constructor(name, age) {this.name = name;this.age = age;}say(data) {return '干啥,' + data;}
}
let maliao = new Boy('马立奥', 3);
let say = maliao.say('我是马立奥');
console.log(say); // 干啥,我是马立奥

类继承

JavaScript 类继承使用 extends 关键字。

继承允许我们依据另一个类来定义一个类,这使得创建和维护一个应用程序变得更容易。

super() 方法用于调用父类的构造函数。

当创建一个类时,您不需要重新编写新的数据成员和成员函数,只需指定新建的类继承了一个已有的类的成员即可。这个已有的类称为基类(父类),新建的类称为派生类(子类)

继承代表了 is a 关系。例如,哺乳动物是动物,狗是哺乳动物,因此,狗是动物,等等。

在这里插入图片描述

// 基类
class Animal {// eat() 函数// sleep() 函数
};//派生类,继承基类 Animal
class Dog extends Animal {// bark() 函数
};

以下实例创建的类 “LittleBoy” 继承了 “Boy” 类:

class Boy {constructor(name) {this.name = name;}say() {return 'hi'}
}
class LittleBoy extends Boy {constructor(name, age) {super(name);this.age = age;}sayHello() {return this.say() + ',我今年' + this.age + '岁啦!';}
}const maliao = new LittleBoy('马立奥', 3);
console.log(maliao); // { name: '马立奥', age: 3 }
console.log(maliao.say()); // hi
console.log(maliao.sayHello()); // hi,我今年 3岁啦。

在这里插入图片描述

super() 方法引用父类的构造方法。

通过在构造方法中调用 super() 方法,我们调用了父类的构造方法,这样就可以访问父类的属性和方法。

继承对于代码可复用性很有用。

静态方法

静态方法是使用 static 关键字修饰的方法,又叫类方法,属于类的,但不属于对象。

在实例化对象之前可以通过 类名.方法名 调用静态方法。

静态方法不能在对象上调用,只能在类中调用。

class Boy {constructor(name) {this.name = name;}static say(x) {return 'hi ' + x.name}
}let maliao = new Boy('马立奥');
console.log(maliao); // { name: '马立奥' }// 这样直接调用会报错,实例对象不能调用静态方法
console.log(maliao.say()); // 如果想在对象 maliao 中使用静态方法,可以作为一个参数传递给它:
console.log(Boy.say(maliao)); // hi 马立奥

在这里插入图片描述

相关文章:

【JS】类 class

【JS】类 class 定义类类的方法类继承静态方法 类(class)是用于创建对象的模板。 我们使用 class 关键字来创建一个类,类体在一对大括号 {} 中,我们可以在大括号 {} 中定义类成员的位置,如方法或构造函数。 每个类中…...

Ubuntu安装harbor(http模式)并随便上传一个

Ubuntu安装harbor(http模式) docker和harbor的介绍就免了,都不知道啥东西,还安装搞毛 先安装docker环境 不要问,软件源之类的配置,挨个梭就行 sudo apt update sudo apt install apt-transport-https ca…...

《向量数据库指南》——腾讯云向量数据库Tencent Cloud Vector DB正式上线公测!提供10亿级向量检索能力

8月1日,腾讯云向量数据库(Tencent Cloud Vector DB)已正式上线公测。在腾讯云官网上搜索“向量数据库”,就可以正式体验该产品。 腾讯云向量数据库不仅能为大模型提供外部知识库,提高大模型回答的准确性,还可广泛应用于推荐系统、文本图像检索、自然语言处理等 AI 领域。…...

1分钟解决github push/pull报错443

1.打开https://www.ipaddress.com/ 2.复制如图IP地址 3.文件夹打开C:\Windows\System32\drivers\etc,复制hosts文件,粘贴到桌面 4.在桌面用记事本打开复制过来的hosts 5.在末尾加上一行,IP写刚才复制的 6.复制桌面的hosts,粘贴回C:\Window…...

vue3学习-ref引用

模板引用 使用特殊的 refattribute 允许再特定的Dom或组件被挂在后&#xff0c;获取他的直接引用。 import { ref } form vue const input ref(null) <input ref"input"/>注意&#xff1a;只可以在组件挂载后才能访问模板引用 #如果你需要侦听一个模板引用 r…...

Docker 容器转为镜像

# 容器转成镜像并指定镜像名称与版本号 # commit 时原有容器挂载的目录是不会被写入到新的镜像中去的&#xff0c;数据卷相关的都不会生效 # 但是 root 目录下新建的内容会写入到新的镜像中去 $ docker commit 容器ID 新镜像名称:版本号 $ docker commit -m"描述信息"…...

阿里云服务器免费试用及搭建WordPress网站

文章目录 前言一、免费试用1、选择使用产品2、进行产品配置3、远程连接阿里云服务器①、重置实例密码②、SecureCRT 远程链接③、Workbench 远程链接二、搭建 WordPress 网站1、开放搭建 WordPress 需要的端口2、搭建 LAMP 环境①、Linux 系统升级和更新源②、安装 Apache2③、…...

整流二极管型号汇总,超齐全

整流二极管是什么二极管&#xff1f;查看资料可知&#xff0c;整流二极管是一种将交流电能转变为直流电能的半导体器件&#xff0c;可见整流二极管的作用重在“整流”。整流二极管主要用于各种低频半波整流电路&#xff0c;如需达到全波整流需连成整流桥使用。近日&#xff0c;…...

MongoDB 操作命令

创建database 有就切换没有创建 useMydatabase 显示数据库&#xff1a;show dbs显示该database下的 bson对象 show collections 显示该bson下的具体内容**mydatabase.mycollection.find()**查询该bson对象内容**且查询****mydatabase.mycollection.find({a:,b:})****或查询****…...

markdown高级写作技巧汇总

文章目录 1 代码diff2 待办事项3 图片设置宽高4 折叠5 锚点链接实现方式① Markdown 原始写法 [名称](#id)② HTML 语法 名称 6 目录树7 换行 1 代码diff 如果你做过代码 Code Review&#xff0c;对下面这种效果肯定很熟悉 // 数组去重 const unique (arr)>{ - return A…...

SpringBoot自动配置原理入门级理解

简单理解 spring中&#xff0c;我们配置一个bean有两种方式&#xff0c;一种是xml标签的形式&#xff0c;一种是通过java类的形式。那么自动装配就是通过java类的形式来配置bean。 不同的是&#xff0c;springboot将这些我们需要的bean提前配置好了以java类的形式存放在META-I…...

2023 08.02 小记与展望

碎碎念系列更新 算是坚持的第一个月&#xff08;每个月更新一次&#xff0c;上次是6.29&#xff09; 主要对上月工作进行总结&#xff0c;并对后续学习内容进行规划。 一、关于工作 7月工作主要涉及以下方面&#xff1a; 1、公司自研APP维护&#xff08;主要是接口更新和修改…...

MaxPatrol SIEM 增加了一套检测供应链攻击的专业技术

我们为 MaxPatrol SIEM 信息安全事件监控系统增加了一套新的专业技术。 该产品可帮助企业防范与供应链攻击相关的威胁。 此类攻击正成为攻击者的首要目标&#xff1a;它们以软件开发商和供应商为目标&#xff0c;网络犯罪分子通过他们的产品进入最终目标的基础设施。 因此&a…...

蓝桥杯上岸每日N题 第六期(求阶乘)!!!

蓝桥杯上岸每日N题第六期 ❗️ ❗️ ❗️ 同步收录 &#x1f447; 蓝桥杯上岸必背&#xff01;&#xff01;&#xff01;(持续更新中~) 大家好 我是寸铁&#x1f4aa; 冲刺蓝桥杯省一模板大全来啦 &#x1f525; 蓝桥杯4月8号就要开始了 &#x1f64f; 距离蓝桥杯省赛倒数…...

Codeforces Round 889 (Div. 2)(视频讲解A——D)

文章目录 A Dalton the TeacherB Longest Divisors IntervalC2 Dual (hard Version)D Earn or Unlock Codeforces Round 889 (Div. 2)&#xff08;视频讲解A——D&#xff09; A Dalton the Teacher #include<bits/stdc.h> #define endl \n #define INF 0x3f3f3f3f us…...

K8s安全配置:CIS基准与kube-bench工具

01、概述 K8s集群往往会因为配置不当导致存在入侵风险&#xff0c;如K8S组件的未授权访问、容器逃逸和横向攻击等。为了保护K8s集群的安全&#xff0c;我们必须仔细检查安全配置。 CIS Kubernetes基准提供了集群安全配置的最佳实践&#xff0c;主要聚焦在两个方面&#xff1a;主…...

linux安装python和部署Django项目

文章目录 1 python安装2 Django项目部署 1 python安装 官网地址&#xff1a;https://www.python.org/ 本次下载的python安装包地址&#xff1a;https://www.python.org/ftp/python/3.8.16/Python-3.8.16.tgz 解压下载的python压缩包 [rootlocalhost software]# tar -zxvf P…...

00-Hadoop入门

Hadoop入门 Hadoop四高 1&#xff09;高可靠性 Hadoop底层维护多个数据副本&#xff0c;所有即使hadoop某个计算元素或存储故障&#xff0c;也不会造成数据丢失 2&#xff09;高扩展性 在集群间分配任务数据&#xff0c;可方便的扩展数以千计的节点 3&#xff09;高效性 …...

SE-Net注意力机制详解

📌本次任务:了解SE-Net原理 SE-Net 是 ImageNet 2017(ImageNet 收官赛)的冠军模型,是由WMW团队发布。具有复杂度低,参数少和计算量小的优点。且SENet 思路很简单,很容易扩展到已有网络结构如 Inception 和 ResNet 中。(这篇论文是2019年的,应该是后续做了更新) 一…...

商城免费搭建之java商城 开源java电子商务Spring Cloud+Spring Boot+mybatis+MQ+VR全景+b2b2c bbc

&#xfeff; 1. 涉及平台 平台管理、商家端&#xff08;PC端、手机端&#xff09;、买家平台&#xff08;H5/公众号、小程序、APP端&#xff08;IOS/Android&#xff09;、微服务平台&#xff08;业务服务&#xff09; 2. 核心架构 Spring Cloud、Spring Boot、Mybatis、R…...

基于i.MX8M Plus与5G的高性能AI边缘计算网关设计与实践

1. 项目概述&#xff1a;为什么我们需要一个“会思考”的边缘网关&#xff1f;在工业现场待久了&#xff0c;你一定会对几个场景深有感触&#xff1a;产线上几十台PLC和传感器&#xff0c;协议五花八门&#xff0c;Modbus、Profibus、CANopen&#xff0c;想统一采集数据得接一堆…...

焦度计的柱镜值是怎么算出来的

项目一直卡在柱镜值的准确性和重复性这里&#xff0c;柱镜值究竟要怎么写代码才能算出来啊?...

制造业的AI智能体,为什么“部署方式”比“功能有多强”更关键?

和几位制造业IT负责人的交流中&#xff0c;有一个现象值得关注&#xff1a;他们最担心的不是AI智能体“能不能用”&#xff0c;而是“怎么部署”。 这和前两年的讨论方向明显不同。2024年前后&#xff0c;行业还在争论AI智能体到底有没有用、能在哪些场景落地。到了2026年&…...

带标注的螺丝、螺栓、垫圈缺陷识别数据集,包含缺陷里包含生锈和划痕,1291张图,支持yolo,coco json,voc xml,文末有模型训练代码。

​ 带标注的螺丝、螺栓、垫圈缺陷识别数据集&#xff0c;包含缺陷里包含生锈和划痕&#xff0c;1291张图&#xff0c;支持yolo&#xff0c;coco json&#xff0c;voc xml,文末有模型训练代码。 数据集拆分 总图数&#xff1a;1291 张图数 训练集 1143 张图 验证集 106 张图…...

2026有赞春季发布会:有效果的AI驱动增长,智能体和数字员工交出成绩单

5月21日&#xff0c;有赞2026年春季发布会在杭州举办&#xff0c;主题是“有效果的AI”。过去一年&#xff0c;有赞智能体和数字员工已经迈入交付结果的新阶段。数据显示&#xff0c;2025年有赞AI智能体活跃使用商家18220个&#xff0c;整体调用量超3600万次&#xff0c;引导成…...

梳理尼日利亚外贸典型骗局分享高效避雷方法

与尼日利亚客户交易须防范D/P条款陷阱&#xff0c;信用证务必经第三国银行保兑&#xff0c;警惕提单信息泄露&#xff0c;掌握风控要点方能安全拓展西非市场。拒绝D/P托收条款切勿接受D/P付款方式。尼日利亚部分银行可能与客户勾结&#xff0c;在买方未付货款的情况下擅自放行提…...

【上篇】SenseNova-U1:基于NEO-unify架构统一多模态理解与生成

&#x1f4e3; 更新动态 [2026.05.15] 发布 SenseNova-U1-8B-MoT-信息图表 &#x1f4ca;&#xff0c;优化信息图表生成功能。详情请参阅 U1信息图表模型&#xff0c;并查看 ✨ 信息图表展示 获取100个生成示例。 ✨ 点击展开历史动态 [2026.05.10] 发布&#x1f525;SenseNo…...

保姆级教程:在Ubuntu上拆解和重组RK356x的update.img固件包

深度解析&#xff1a;Ubuntu环境下RK356x固件逆向工程与定制化实践 引言 在嵌入式开发领域&#xff0c;瑞芯微RK356x系列芯片因其出色的性能和丰富的接口资源&#xff0c;已成为智能硬件开发的热门选择。然而&#xff0c;官方提供的固件包往往无法完全满足特定项目的需求&#…...

王力宏重仓比亚迪,行业震惊

王力宏最近以腾势汽车全球代言人的身份亮相发布会&#xff0c;现场直言&#xff1a;“后悔10年前没投资比亚迪&#xff0c;这次我要把握机会。” 当被问及是否用代言费买了比亚迪股票&#xff0c;他大方承认“这是真的”。他还补充道&#xff1a;“10年前我做过一档节目&#x…...

裁员风暴:从大厂骨干到失业边缘

2024年的春天&#xff0c;我在一家头部互联网公司担任测试主管的第八个年头&#xff0c;一场突如其来的裁员风暴打破了看似安稳的生活。公司战略收缩&#xff0c;测试部门首当其冲&#xff0c;我和近三成同事被列入优化名单。看着熟悉的工位被迅速清空&#xff0c;手里的离职证…...