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

面试题-TS(四):如何在 TypeScript 中使用类和继承?

面试题-TS(4):如何在 TypeScript 中使用类和继承?

在TypeScript中,类是一种重要的概念,它允许我们使用面向对象的编程风格来组织和管理代码。类提供了一种模板,用于创建具有相同属性和行为的对象。通过继承,我们可以创建类之间的层次结构,实现代码的重用和扩展。

1. 类的定义和使用

在TypeScript中,我们使用class关键字来定义类。以下是一个简单的类的示例:

class Person {name: string;age: number;constructor(name: string, age: number) {this.name = name;this.age = age;}greet(): void {console.log(`Hello, my name is ${this.name}. I'm ${this.age} years old.`);}
}

在上面的示例中,我们定义了一个名为Person的类,它具有nameage属性,以及一个greet方法。构造函数用于初始化对象的属性。

创建类的实例非常简单,只需使用new关键字加上类的构造函数即可:

let person = new Person("John", 25);
person.greet();  // 输出:Hello, my name is John. I'm 25 years old.

通过类的定义,我们可以创建多个具有相同属性和行为的对象,实现代码的复用和封装。

2. 继承和子类

在面向对象编程中,继承是一种重要的概念。通过继承,我们可以创建一个类的子类(也称为派生类),并继承其属性和方法。子类可以扩展或修改父类的功能,从而实现代码的重用和扩展。

在TypeScript中,我们使用extends关键字来指定一个类继承自另一个类。以下是一个简单的继承示例:

class Student extends Person {studentId: string;constructor(name: string, age: number, studentId: string) {super(name, age);this.studentId = studentId;}study(): void {console.log(`Student ${this.name} is studying with student ID ${this.studentId}.`);}
}

在上面的示例中,我们定义了一个名为Student的子类,它继承自Person父类。子类具有自己的属性studentId,并通过调用super关键字来调用父类的构造函数。

创建子类的实例与创建父类的实例类似:

let student = new Student("Alice", 20, "12345");
student.greet();  // 输出:Hello, my name is Alice. I'm 20 years old.
student.study();  // 输出:Student Alice is studying with student ID 12345.

通过继承和创建子类的实例,我们可以使用父类的属性和方法,并且可以扩展子类的功能。

3. 方法的重写

子类可以重写(override)父类的方法,以实现特定的行为。通过在子类中重新定义与父类相同名称的方法,可以覆盖父类中的方法实现。

以下是一个重写父类方法的示例:

class Teacher extends Person {subject: string;constructor(name: string, age: number, subject: string) {super(name, age);this.subject = subject;}greet(): void {console.log(`Hello, my name is ${this.name}. I teach ${this.subject}.`);}
}

在上面的示例中,我们定义了一个名为Teacher的子类,它继承自Person父类,并重写了父类的greet方法。通过重写,我们可以在子类中定制特定的行为。

创建子类的实例并调用重写后的方法:

let teacher = new Teacher("Mr. Smith", 35, "Math");
teacher.greet();  // 输出:Hello, my name is Mr. Smith. I teach Math.

通过方法的重写,我们可以根据子类的需求来修改或扩展父类的行为。

4. 访问修饰符

在TypeScript中,我们可以使用访问修饰符来限制类的属性和方法的访问。以下是几个常用的访问修饰符:

  1. public(默认):可以在类内部和外部访问。
  2. private:只能在类内部访问。
  3. protected:可以在类内部和子类中访问,但不能在类外部访问。

例如

class Person {public name: string;private age: number;protected gender: string;constructor(name: string, age: number, gender: string) {this.name = name;this.age = age;this.gender = gender;}sayHi() {console.log(`Hi, my name is ${this.name}.`);}private sayAge() {console.log(`I am ${this.age} years old.`);}
}class Student extends Person {constructor(name: string, age: number, gender: string) {super(name, age, gender);}sayGender() {console.log(`My gender is ${this.gender}.`);}
}let person = new Person("Tom", 18, "male");
console.log(person.name); // "Tom"
console.log(person.age); // Error: Property 'age' is private and only accessible within class 'Person'.
console.log(person.gender); // Error: Property 'gender' is protected and only accessible within class 'Person' and its subclasses.let student = new Student("Jane", 20, "female");
console.log(student.gender); // "female"

通过使用访问修饰符,我们可以控制类的成员的可见性,增强了封装性和安全性。

5. 抽象类

在TypeScript中,我们还可以使用抽象类(abstract class)来定义一个不可实例化的基类。抽象类提供了一种模板,用于派生其他类,并定义了一些必须由子类实现的抽象方法。抽象类不能被直接实例化,只能被继承。

以下是一个抽象类的示例:

abstract class Shape {abstract calculateArea(): number;
}class Rectangle extends Shape {width: number;height: number;constructor(width: number, height: number) {super();this.width = width;this.height = height;}calculateArea(): number {return this.width * this.height;}
}

在上面的示例中,我们定义了一个抽象类Shape,它具有一个抽象方法calculateArea。子类Rectangle继承自Shape,并实现了calculateArea方法。

通过抽象类,我们可以定义一些基础的行为和方法,并强制子类实现这些方法,从而实现了代码的规范和扩展性。

总结

使用类和继承可以使我们的代码更具结构和可读性,减少重复代码,并实现高度灵活和可扩展的应用程序。在TypeScript中充分利用类和继承的优势,将提升我们的开发效率和代码质量。

相关文章:

面试题-TS(四):如何在 TypeScript 中使用类和继承?

面试题-TS(4):如何在 TypeScript 中使用类和继承? 在TypeScript中,类是一种重要的概念,它允许我们使用面向对象的编程风格来组织和管理代码。类提供了一种模板,用于创建具有相同属性和行为的对象。通过继承&#xff0…...

React之JSX的介绍与使用步骤,注意事项,条件渲染,列表渲染以及css样式处理

React之JSX的介绍与使用 一、JSX的介绍二、JSX使用步骤三、JSX注意事项四、JSX中使用JavaScript表达式五、条件渲染六、列表渲染七、CSS样式处理八、JSX 总结 一、JSX的介绍 简介 JSX是JavaScript XML的简写,表示了在Javascript代码中写XML(HTML)格式的代码 优势 声…...

sql进阶:求满足某列数值相加无限接近90%的行(90分位)

sql 一、案例分析二、思路三、代码实现一、案例分析 表中有某个id列和数值列,求数值列占比为90%的id,如有个用户表,存储id和消费金额order_cnt,求一条sql查出消费占比无限接近90%的所有客户,如表中总消费为10000,占比最高的是4000、3000、2800,对应A、B、C用户,查出A、B、C用户…...

设计模式大白话——观察者模式

文章目录 一、概述二、示例三、模式定义四、其他 一、概述 ​ 与其叫他观察者模式,我更愿意叫他叫 订阅-发布模式 ,这种模式在我们生活中非常常见,比如:追番了某个电视剧,当电视剧有更新的时候会第一时间通知你。当你…...

机器学习小记-序

机器学习是人工智能的一个重要分支,根据学习任务的不同,可以将机器学习分为以下几类: 监督学习(Supervised Learning): 应用场景:监督学习适用于已标记数据集的任务,其中每个样本都有…...

IP基础知识总结

IP他负责的是把IP数据包在不同网络间传送,这是网络设计相关的,与操作系统没有关系。所以这部分知识,不是网络的重点。IP和路由交换技术联系紧密。但是要作为基本知识点记住。 一、基本概念 网络层作用:实现主机与主机之间通信。 …...

Java设计模式-单例模式

单例模式 1.单例模式含义 单例模式就是保证一个类仅有一个实例,并提供一个访问它的全局访问点。 其实单例模式很好理解,当我们new一个对象实例的时候,这个对象会被放到一个内存中,当我们再次new同一个对象的实例的时候&#xf…...

小程序----配置原生内置编译插件支持sass

修改project.config.json配置文件 在 project.config.json 文件中,修改setting 下的 useCompilerPlugins 字段为 ["sass"], 即可开启工具内置的 sass 编译插件。 目前支持三个编译插件:typescript、less、sass 修改之后可以将原.w…...

GitLab 删除项目

1.点击头像 2.点击Profile 3.选择要删除的项目点进去 4.settings-general-Advances-expand 5.然后在弹出框中输入你要删除的项目名称即可...

Mac m1 下eclipse下载及jdk环境变量配置

一、安装eclipse 1、下载eclipse Eclipse downloads - Select a mirror | The Eclipse Foundation 此版本为m1芯片适用版本 2、下载后下一步安装即可 安装成功后,可以看到图标: 二、安装jdk 1、下载jdk 下载此版本即可,下载完成之后一直…...

Java中List与数组之间的相互转换

一、List列表与对象数组 List列表中存储对象&#xff0c;如List<Integer>、List<String>、List<Person>&#xff0c;对象数组中同样存储相应的对象&#xff0c;如Integer[]、String[]、Person[]&#xff0c;对象数组与对象List的转换可通过如下方式实现&…...

嵌入式_GD32看门狗配置

嵌入式_GD32独立看门狗配置与注意事项 文章目录 嵌入式_GD32独立看门狗配置与注意事项前言一、什么是独立看门狗定时器&#xff08;FWDGT&#xff09;二、独立看门狗定时器原理三、独立看门狗定时器配置过程与注意事项总结 前言 使用GD3单片机时&#xff0c;为了提供了更高的安…...

Python 中的 JSON 操作:简单、高效的数据交换格式

在现代的数据交换和存储中&#xff0c;JSON&#xff08;JavaScript Object Notation&#xff09;作为一种轻量级的数据交换格式&#xff0c;备受青睐。它不仅易于阅读和理解&#xff0c;还可以灵活地表达和存储高维数据。本文将介绍如何在 Python 中操作 JSON 文件&#xff0c;…...

IT行业面试攻略:技巧与心态的平衡

引言&#xff1a;在面试IT公司时&#xff0c;调整好心态是取得优秀表现的关键。面试心态直接影响着我们在面试中的自信程度和表现。面对这一挑战&#xff0c;我们需要学会积极自信、认识到紧张是正常的、进行充分准备以及以积极的心态去迎接面试。只有在拥有正确的心态下&#…...

【玩转Linux】标准io缓冲区的操作

(꒪ꇴ꒪ ),hello我是祐言博客主页&#xff1a;C语言基础,Linux基础,软件配置领域博主&#x1f30d;快上&#x1f698;&#xff0c;一起学习&#xff01;送给读者的一句鸡汤&#x1f914;&#xff1a;集中起来的意志可以击穿顽石!作者水平很有限&#xff0c;如果发现错误&#x…...

28.JavaWeb-Elasticsearch

1.Elasticsearch概述 Elasticsearch 是一个分布式的全文检索引擎。采用Java语言开发&#xff0c;基于Apache协议的开源项目&#xff0c;具有实时搜索&#xff0c;稳定&#xff0c;可靠&#xff0c;快速的特点。 1.1 全文检索引擎 分为通用搜索引擎&#xff08;百度、谷歌&…...

Python Flask构建微信小程序订餐系统 (十)

🔥 编辑会员信息 🔥 编辑会员信息可以通过点击会员列表操作,也可以点击会员信息详情点击进行操作 🔥 修改编程会员信息列表布局 🔥 修改 web/templates/member/index.html 文件,添加跳转到编辑会员信息的页面 web/templates/member/set.html 🔥 创建用于会员…...

j2ee相关知识点

浏览器栏中&#xff0c;输入的是servlet的mapping映射&#xff0c;请求到servlet中去&#xff0c;jsp路径&#xff0c;会跳转到对应的页面 Servlet接口位于最顶端&#xff0c;GenericServlet实现了Servlet&#xff0c;HttpServlet继承了GenericServlet 浏览器中访问Servlet映…...

Shell脚本学习-eval内置命令

这个命令&#xff0c;平时接触不是很多&#xff0c;所以不知道是什么回事。 eval内置命令&#xff1a; 功能&#xff1a;当Shell程序执行到eval语句的时候&#xff0c;Shell读入参数args&#xff0c;并将它们组合成一个新的命令&#xff0c;然后执行。也就是重新运算求出参数的…...

word中将合并后的多行拆分为原先的行数

word中将已经合并的多行拆分为原先的行数&#xff0c;我们不用刻意去数应该是多少行&#xff0c; 只需将拆分的行数不断增加&#xff0c;word会默认最大增加到合并前的行数。...

用51单片机+无源蜂鸣器播放《两只老虎》完整教程(附代码与乐理速成)

用51单片机驱动无源蜂鸣器演奏《两只老虎》全流程解析 第一次听到单片机播放音乐时&#xff0c;那种"机器唱歌"的奇妙感至今难忘。作为电子爱好者入门必备的趣味项目&#xff0c;用蜂鸣器演奏音乐不仅能巩固定时器、中断等核心知识&#xff0c;更能将枯燥的理论转化为…...

OpenClaw多模态扩展:Qwen3.5-4B-Claude处理截图与PDF

OpenClaw多模态扩展&#xff1a;Qwen3.5-4B-Claude处理截图与PDF 1. 为什么需要多模态能力&#xff1f; 去年夏天&#xff0c;我遇到一个头疼的问题&#xff1a;需要从几百份PDF报告里提取关键数据。手动复制粘贴不仅耗时&#xff0c;还容易出错。当时我就在想&#xff0c;如…...

AI 模型量化精度控制与评估方法

AI模型量化精度控制与评估方法 随着人工智能技术的快速发展&#xff0c;AI模型在边缘计算、移动设备等资源受限场景中的应用日益广泛。为了在有限的计算资源下保持模型性能&#xff0c;量化技术成为关键手段。量化过程中精度的损失直接影响模型的可靠性&#xff0c;因此量化精…...

别再死记硬背了!用这3个真实项目案例,帮你彻底搞懂软件工程导论里的核心概念

从真实项目学软件工程&#xff1a;3个案例拆解核心概念 记得第一次翻开《软件工程导论》时&#xff0c;我被满篇的"瀑布模型"、"软件危机"弄得晕头转向——这些抽象概念和现实开发到底有什么关系&#xff1f;直到参与实际项目后&#xff0c;那些课本上的理…...

告别手打公式!用SimpleTex截图转LaTeX+Axmath微调+Typora排版的保姆级教程

数学公式高效处理全流程&#xff1a;从截图识别到专业排版 每次在论文或笔记中插入复杂的数学公式时&#xff0c;你是否也经历过这样的痛苦&#xff1f;反复核对LaTeX代码中的每个括号&#xff0c;调整上下标位置&#xff0c;或是为了一个特殊符号翻遍文档。传统的手动输入方式…...

Deformable-DETR环境配置避坑:如何正确设置CUDA_HOME解决ms_deformable_im2col_cuda报错

Deformable-DETR环境配置实战&#xff1a;从CUDA路径排查到高效编译 当你第一次尝试运行Deformable-DETR这个强大的目标检测框架时&#xff0c;是否也遇到了那个令人头疼的报错&#xff1a;"error in ms_deformable_im2col_cuda: no kernel image is available for execut…...

2026年上海网站建设市场分析:企业官网从展示到增长的演进路径

2026年&#xff0c;上海企业数字化服务市场迎来结构性变革。据2026年上半年上海企业数字化服务市场调研数据显示&#xff0c;上海地区企业官网新建与升级需求同比增长45%&#xff0c;中大型企业对官网的核心诉求已从基础信息展示转向AI智能赋能、全球化跨境适配、全链路营销转化…...

ente/auth缓存机制详解:提高系统响应速度

ente/auth缓存机制详解&#xff1a;提高系统响应速度 【免费下载链接】ente 完全开源&#xff0c;端到端加密的Google Photos和Apple Photos的替代品 项目地址: https://gitcode.com/GitHub_Trending/en/ente ente/auth作为专注于移动设备的两步验证&#xff08;2FA&…...

人工智能毕业设计2026方向集合

0 选题推荐 - 人工智能篇 毕业设计是大家学习生涯的最重要的里程碑&#xff0c;它不仅是对四年所学知识的综合运用&#xff0c;更是展示个人技术能力和创新思维的重要过程。选择一个合适的毕业设计题目至关重要&#xff0c;它应该既能体现你的专业能力&#xff0c;又能满足实际…...

Wan2.2-I2V-A14B镜像免配置实战:开箱即用,省去PyTorch/CUDA环境冲突烦恼

Wan2.2-I2V-A14B镜像免配置实战&#xff1a;开箱即用&#xff0c;省去PyTorch/CUDA环境冲突烦恼 1. 镜像概述与核心优势 Wan2.2-I2V-A14B是一款专为文生视频任务优化的私有部署镜像&#xff0c;基于RTX 4090D 24GB显存显卡和CUDA 12.4环境深度定制。这个镜像的最大特点是开箱…...