TS（type，属性修饰符，抽象类，interface）一次性全部总结

news2024/10/2 23:12:17

目录

1.type

1.基本用法

2.联合类型

3.交叉类型

2.属性修饰符

1.public  属性修饰符

属性的简写形式

2.proteced  属性修饰符

3.private   属性修饰符

4.readonly  属性修饰符

3.抽象类

4.interface

1.定义类结构

2.定义对象结构

3.定义函数结构

4.接口之间的继承

5.接口自动合并

5. interface和type的区别

6. interface与抽象类的区别

1.type

type  可以为任意类型创建别名，让代码更简洁，可读性更强，同时能更方便的进行类型复用和扩展。

1.基本用法

type num = number;

let price: num
price = 100

2.联合类型

type Status = number | string
type Gender = '男' | '⼥'

function printStatus(status: Status) {
  console.log(status)
}

function logGender(str: Gender) {
  console.log(str)
}

printStatus(404)
printStatus('200')
printStatus('501')

logGender('男')
logGender('⼥')

3.交叉类型

//⾯积
type Area = {
  height: number //⾼
  width: number //宽
}

//地址
type Address = {
  num: number //楼号
  cell: number //单元号
  room: string //房间号
}

// 定义类型House，且House是Area和Address组成的交叉类型
type House = Area & Address

const house: House = {
  height: 180,
  width: 75,
  num: 6,
  cell: 3,
  room: '702'
}

2.属性修饰符

1.public  属性修饰符

class Person {
  // name写了public修饰符，age没写修饰符，最终都是public修饰符
  public name: string
  age: number
  constructor(name: string, age: number) {
    this.name = name
    this.age = age
  }
  speak() {
    // 类的【内部】可以访问public修饰的name和age
    console.log(`我叫：${this.name}，今年${this.age}岁`)
  }
}

const p1 = new Person('张三', 18)
// 类的【外部】可以访问public修饰的属性
console.log(p1.name)
class Student extends Person {
  constructor(name: string, age: number) {
    super(name, age)
  }

  study() {
    // 【⼦类中】可以访问⽗类中public修饰的：name属性、age属性
    console.log(`${this.age}岁的${this.name}正在努⼒学习`)
  }
}
属性的简写形式
class Person {
  constructor(
    public name: string,
    public age: number
  ) {}
}

2.proteced  属性修饰符

class Person {
  // name和age是受保护属性，不能在类外部访问，但可以在【类】与【⼦类】中访问
  constructor(
    protected name: string,
    protected age: number
  ) {}
  // getDetails是受保护⽅法，不能在类外部访问，但可以在【类】与【⼦类】中访问
  protected getDetails(): string {
    // 类中能访问受保护的name和age属性
    return `我叫：${this.name}，年龄是：${this.age}`
  }
  // introduce是公开⽅法，类、⼦类、类外部都能使⽤
  introduce() {
    // 类中能访问受保护的getDetails⽅法
    console.log(this.getDetails())
  }
}

const p1 = new Person('杨超越', 18)
// 可以在类外部访问introduce
p1.introduce()

// 以下代码均报错
// p1.getDetails()
// p1.name
// p1.age
class Student extends Person {
  constructor(name: string, age: number) {
    super(name, age)
  }
  study() {
    // ⼦类中可以访问introduce
    this.introduce()
    // ⼦类中可以访问name
    console.log(`${this.name}正在努⼒学习`)
  }
}

const s1 = new Student('tom', 17)
s1.introduce()

3.private   属性修饰符

class Person {
  constructor(
    public name: string,
    public age: number,
    // IDCard属性为私有的(private)属性，只能在【类内部】使⽤
    private IDCard: string
  ) {}
  private getPrivateInfo() {
    // 类内部可以访问私有的(private)属性 —— IDCard
    return `身份证号码为：${this.IDCard}`
  }
  getInfo() {
    // 类内部可以访问受保护的(protected)属性 —— name和age
    return `我叫: ${this.name}, 今年刚满${this.age}岁`
  }
  getFullInfo() {
    // 类内部可以访问公开的getInfo⽅法，也可以访问私有的getPrivateInfo⽅法
    return this.getInfo() + '，' + this.getPrivateInfo()
  }
}

const p1 = new Person('张三', 18, '110114198702034432')
console.log(p1.getFullInfo())
console.log(p1.getInfo())

// 以下代码均报错
// p1.name
// p1.age
// p1.IDCard
// p1.getPrivateInfo()

4.readonly  属性修饰符

class Car {
  constructor(
    public readonly vin: string, //⻋辆识别码，为只读属性
    public readonly year: number, //出⼚年份，为只读属性
    public color: string,
    public sound: string
  ) {}
  // 打印⻋辆信息
  displayInfo() {
    console.log(`
    识别码：${this.vin},
    出⼚年份：${this.year},
    颜⾊：${this.color},
    ⾳响：${this.sound}
    `)
  }
}

const car = new Car('1HGCM82633A123456', 2018, '⿊⾊', 'Bose⾳响')
car.displayInfo()
// 以下代码均错误：不能修改 readonly 属性
// car.vin = '897WYE87HA8SGDD8SDGHF';
// car.year = 2020;

3.抽象类

简记：抽象类不能被实例化，其意义是可以被继承，抽象类里可以有普通方法，也可以有抽象方法。

通过以下场景，理解抽象类：

我们定义一个抽象类Package，表示所有包裹的基本结构，任何包裹都有重量属性weight，包裹需要计算费用。但不同类型的包裹（如：标准速度，特快专递）都有不同的计算方式，因此用于计算费用的calculate方法是一个抽象方法，必须由具体的子类来实现。 

abstract class Package {
  constructor(public weight: number) {}
  // 抽象⽅法：⽤来计算运费，不同类型包裹有不同的计算⽅式
  abstract calculate(): number
  // 通⽤⽅法：打印包裹详情
  printPackage() {
    console.log(`包裹重量为: ${this.weight}kg，运费为: ${this.calculate()}元`)
  }
}

// 标准包裹
class StandardPackage extends Package {
  constructor(
    weight: number,
    public unitPrice: number // 每公⽄的固定费率
  ) {
    super(weight)
  }
  // 实现抽象⽅法：计算运费
  calculate(): number {
    return this.weight * this.unitPrice
  }
}
// 创建标准包裹实例
const s1 = new StandardPackage(10, 5)
s1.printPackage()

class ExpressPackage extends Package {
  constructor(
    weight: number,
    private unitPrice: number, // 每公⽄的固定费率（快速包裹更⾼）
    private additional: number // 超出10kg以后的附加费
  ) {
    super(weight)
  }
  // 实现抽象⽅法：计算运费
  calculate(): number {
    if (this.weight > 10) {
      // 超出10kg的部分，每公⽄多收additional对应的价格
      return 10 * this.unitPrice + (this.weight - 10) * this.additional
    } else {
      return this.weight * this.unitPrice
    }
  }
}
// 创建特快包裹实例
const e1 = new ExpressPackage(13, 8, 2)
e1.printPackage()

像是这样的形式我自己有自己的理解形式：

        好比如我们走路，起点都是一样的，终点也是一样的，唯独我们的过程是不一样的，有的骑车，有的走路等等，但是这多种方式我们就可以写成继承的方式，那么我们总共花费的时间就可以写在这个抽象类里面。 

4.interface

1.定义类结构

interface是一种定义结构的方式，主要作用是为：类，对象，函数等规定一种契约，这样可以确保代码的一致性和类型安全，但要注意interface只能定义格式,不能包含任何实现!

// PersonInterface接⼝，⽤与限制Person类的格式
interface PersonInterface {
  name: string
  age: number
  speak(n: number): void
}
// 定义⼀个类 Person，实现 PersonInterface 接⼝
class Person implements PersonInterface {
  constructor(
    public name: string,
    public age: number
  ) {}
  // 实现接⼝中的 speak ⽅法
  speak(n: number): void {
    for (let i = 0; i < n; i++) {
      // 打印出包含名字和年龄的问候语句
      console.log(`你好，我叫${this.name}，我的年龄是${this.age}`)
    }
  }
}
// 创建⼀个 Person 类的实例 p1，传⼊名字 'tom' 和年龄 18
const p1 = new Person('tom', 18)
p1.speak(3)

2.定义对象结构

interface UserInterface {
  name: string
  readonly gender: string // 只读属性
  age?: number // 可选属性
  run: (n: number) => void
}
const user: UserInterface = {
  name: '张三',
  gender: '男',
  age: 18,
  run(n) {
    console.log(`奔跑了${n}⽶`)
  }
}

3.定义函数结构

interface CountInterface {
  (a: number, b: number): number
}
const count: CountInterface = (x, y) => {
  return x + y
}

4.接口之间的继承

interface PersonInterface {
  name: string // 姓名
  age: number // 年龄
}

interface StudentInterface extends PersonInterface {
  grade: string // 年级
}

const stu: StudentInterface = {
  name: '张三',
  age: 25,
  grade: '⾼三'
}

5.接口自动合并

// PersonInterface接⼝
interface PersonInterface {
  // 属性声明
  name: string
  age: number
}

// 给PersonInterface接⼝添加新属性
interface PersonInterface {
  // ⽅法声明
  speak(): void
}

// Person类实现PersonInterface
class Person implements PersonInterface {
  name: string
  age: number
  // 构造器
  constructor(name: string, age: number) {
    this.name = name
    this.age = age
  }
  // ⽅法
  speak() {
    console.log('你好！我是⽼师:', this.name)
  }
}

5. interface和type的区别

  • 相同点：interface和type都可以定义对象结构，在定义对象结构时两者可以互换。
  • 不同点：
    • interface：更专注于定义对象和类的结构，支持继承，合并。
    • type：可以定义类型别名，联合类型，交叉类型，但不支持继承和自动合并。

6. interface与抽象类的区别

  • 相同点：都能定义一个类的格式（定义类应遵循的契约）
  • 不同点：
    • 接口：只能描述结构，不能有任何代码实现，一个类可以实现多个接口
    • 抽象类：既可以包含抽象方法，也可以包含具体方法，一个类只能继承一个抽象类

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

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

相关文章

postgresql|数据库|postgis编译完成后的插件迁移应该如何做（postgis插件最终章）

postgresql|数据库|postgis编译完成后的插件迁移应该如何做（postgis插件最终章）

一、 本文的写作理由 postgis插件一般是编译安装&#xff0c;编译安装的原因是可以选择自己喜欢的版本&#xff0c;但编译的难度也是比较高的&#xff0c;因为有各种依赖&#xff0c;依赖之间还有依赖&#xff0c;非常容易形成依赖循环&#xff0c;因此&#xff0c;失败率是比…
阅读更多...
【Python】CSVKit：强大的命令行CSV工具套件

【Python】CSVKit：强大的命令行CSV工具套件

CSVKit 是一个基于命令行的工具集&#xff0c;用于简化 CSV 文件的处理和管理。它提供了从数据转换、筛选、格式化到分析的全方位支持&#xff0c;特别适合需要处理复杂表格数据的用户。相比传统的 Excel 操作&#xff0c;CSVKit 更高效且功能更强大&#xff0c;非常适合数据分…
阅读更多...
VSOMEIP代码阅读整理(1) - 网卡状态监听

VSOMEIP代码阅读整理(1) - 网卡状态监听

一. 概述 在routing进程所使用的配置文件中&#xff0c;存在如下配置项目&#xff1a;{"unicast" : "192.168.56.101",..."service-discovery" :{"enable" : "true","multicast" : "224.244.224.245",…
阅读更多...
线程和进程的关系和区别

线程和进程的关系和区别

目录 进程 概念 特点 生命周期 进程的通信 应用场景 线程 概念 特点 类型 状态 调度 应用场景 线程和进程的关系与区别 关系 区别 总结 僵尸进程 产生原因 解决方法 进程 概念 第一&#xff0c;进程是一个实体。每一个进程都有它自己的地址空间&#xff…
阅读更多...
数字通信中不同信道类型对通信系统性能影响matlab仿真分析,对比AWGN,BEC,BSC以及多径信道

数字通信中不同信道类型对通信系统性能影响matlab仿真分析,对比AWGN,BEC,BSC以及多径信道

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 (完整程序运行后无水印) 2.算法运行软件版本 matlab2022a 3.部分核心程序 &#xff08;完整版代码包含详细中文注释和操作步骤视频&#xff09…
阅读更多...
C0013.Clion中利用C++调用opencv打开摄像头

C0013.Clion中利用C++调用opencv打开摄像头

下载opencv https://opencv.org/get-started/ 直接官网下载opencv-4.9.0-windows.exe 安装opencv opencv配置环境变量 如上安装配置完成。
阅读更多...
SpringBoot框架下的健康信息管理解决方案

SpringBoot框架下的健康信息管理解决方案

第1章 绪论 1.1背景及意义 随着社会的快速发展&#xff0c;计算机的影响是全面且深入的。人们生活水平的不断提高&#xff0c;日常生活中人们对医院管理方面的要求也在不断提高&#xff0c;由于老龄化人数更是不断增加&#xff0c;使得师生健康信息管理系统的开发成为必需而且紧…
阅读更多...
第三批安全可靠评测名单公布，几家欢喜几家忧

第三批安全可靠评测名单公布，几家欢喜几家忧

9月30号&#xff0c;赶在国庆长假之前&#xff0c;中国信息安全评测中心发布了《安全可靠评测结果公告(2024年第2号)》&#xff0c;测试结果自发布之日起有效期三年。 本期测试分为集中式数据库、分布式数据库和中央处理器三个大类&#xff0c;结果共有14家公司的16个产品入围&…
阅读更多...
AI绘画实现数字人2D形象生成及3D数字人视频生成

AI绘画实现数字人2D形象生成及3D数字人视频生成

概述 随着人工智能技术的不断进步&#xff0c;AI绘画已经成为数字艺术创作领域的重要工具。本章将详细介绍如何利用AI绘画技术生成数字人的2D形象&#xff0c;并进一步将其转化为3D数字人视频。通过一系列实践步骤和Python代码示例&#xff0c;您将能够掌握从平台使用到系统部…
阅读更多...
计算机毕业设计之：音乐媒体播放及周边产品运营平台（源码+文档+讲解）

计算机毕业设计之：音乐媒体播放及周边产品运营平台（源码+文档+讲解）

博主介绍&#xff1a; ✌我是阿龙&#xff0c;一名专注于Java技术领域的程序员&#xff0c;全网拥有10W粉丝。作为CSDN特邀作者、博客专家、新星计划导师&#xff0c;我在计算机毕业设计开发方面积累了丰富的经验。同时&#xff0c;我也是掘金、华为云、阿里云、InfoQ等平台…
阅读更多...
看Threejs好玩示例，学习创新与技术(Noise)

看Threejs好玩示例，学习创新与技术(Noise)

给图像加一点噪声效果&#xff0c;可以起到朦胧背景的效果&#xff0c;比如下面这幅画。 除了普通的图片外&#xff0c;我们可以把这个效果应用到地图或其他方面&#xff0c;比如超过范围不允许用户了解更详细的内容。当然&#xff0c;也可以采用雾Fog效果&#xff0c;但后处理…
阅读更多...
鸿蒙ArkUI实战开发-主打自研语言及框架

鸿蒙ArkUI实战开发-主打自研语言及框架

ArkUI 是 HarmonyOS 的声明式 UI 开发框架&#xff0c;而 ArkUI-X 是基于 ArkUI 框架扩展而来的跨平台开发框架。ArkUI-X 支持 HarmonyOS、OpenHarmony、Android 和 iOS 平台&#xff0c;允许开发者使用一套代码构建支持多平台的应用程序。 一、ArkUI-X 的实战开发步骤 在实战开…
阅读更多...
（c++）在堆区创建一个数组并且访问与释放

（c++）在堆区创建一个数组并且访问与释放

在堆区创建一个数组&#xff0c;然后利用一个指针指向这个数组的首地址&#xff0c;通过这个指针来访问这个数组。 代码展示了三种赋值的方式&#xff1a; 1.直接利用数组访问赋值 2.利用循环结构&#xff08;和1原理一样&#xff09; 3.循环结构键盘输入赋值 然后输出这个…
阅读更多...
Ray_Tracing_In_One_Weekend上

Ray_Tracing_In_One_Weekend上

目标&#xff1a; 使用vscodeIDE编写代码&#xff0c;这是我的配置 学习这个教程&#xff0c;完成一个简易的光线追踪器开发 1输出PPM图像 在不使用 opengl &#xff08;渲染图像&#xff09;/ std_image.h&#xff08;加载图像&#xff09;等库的情况下&#xff0c;怎样通…
阅读更多...
某信服, 一点底线都没有, 一点Face都不要

某信服, 一点底线都没有, 一点Face都不要

某些软件厂商, 仗着自己有点背景, 做出来的东西真的是流氓 !!! 铁子们, 这玩意儿怎么卸载呢?
阅读更多...
CertiK《Hack3d：2024年第三季度安全报告》（附报告全文链接）

CertiK《Hack3d：2024年第三季度安全报告》（附报告全文链接）

CertiK《Hack3d&#xff1a;2024年第三季度Web3.0安全报告》现已发布&#xff0c;本次报告深入分析了2024年7月至9月的链上安全状况&#xff0c;本季度总损失金额为7.53亿美元&#xff0c;网络钓鱼和私钥泄露是本季度造成资产损失的主要原因。 ​ 关键数据 2024年第三季度&a…
阅读更多...
数电基础（脉冲波形的变化和发生+multisim）

数电基础（脉冲波形的变化和发生+multisim）

1.脉冲波形的变化和发生 1.1单稳态电路 1.1.1逻辑门组成的单稳态电路 基本概念 &#xff08;1&#xff09;单稳态电路&#xff08;monostable multivibrator又称one-shot&#xff09;常用于脉冲的变换&#xff0c;延时和定时 电路的输出有稳态和暂稳态两个不同的工作状态 …
阅读更多...
java常用框架结构

java常用框架结构

1. Spring框架 特色&#xff1a;Spring框架就像是一个万能工具箱&#xff0c;提供了丰富的功能来满足开发者的各种需求。它支持面向切面编程&#xff08;AOP&#xff09;、依赖注入&#xff08;DI&#xff09;等特性&#xff0c;使得代码更加模块化和可维护。Spring还提供了对数…
阅读更多...
【web安全】——XXE漏洞

【web安全】——XXE漏洞

1.XML基础 1.1.XML简介 XML被称为可扩展标记语言&#xff0c;与HTML类似&#xff0c;但是HTML中的标签都是预定义(预先定义好每个标签的作用)的&#xff0c;而XML语言中的标签都是自定义(可以自己定义标签的名称、属性、值、作用)的;HTML中的标签可以是单标签&#xff0c;而X…
阅读更多...
洛谷 P11045 [蓝桥杯 2024 省 Java B] 最优分组

洛谷 P11045 [蓝桥杯 2024 省 Java B] 最优分组

[Problem Discription] \color{blue}{\texttt{[Problem Discription]}} [Problem Discription] [Analysis] \color{blue}{\texttt{[Analysis]}} [Analysis] 首先得注意这么一点&#xff1a; k k k 必须得是 n n n 的因数&#xff08;这里的 n , k n,k n,k 对应于题目的 N ,…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023