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

TS中断言、转换的应用

1.TS 类型断言定义

把两种能有重叠关系的数据类型进行相互转换的一种 TS 语法,把其中的一种数据类型转换成另外一种数据类型。类型断言和类型转换产生的效果一样,但语法格式不同。

2.TS 类型断言语法格式

A 数据类型的变量 as B 数据类型 。

A 数据类型和 B 数据类型必须具有重叠关系。

3.TS 类型断言使用规则和场景
(1)如果 A,B 如果是类并且有继承关系

【 extends 关系】无论 A,B 谁是父类或子类, A 的对象变量可以断言成 B 类型,B 的对象变量可以断言成A类型 。但注意一般在绝大多数场景下都是把父类的对象变量断言成子类。

class People {public myusername!: string;public myage!: number;public address!: stringpublic phone!: stringconstructor() {}eat() {}step() {console.log("People=>step");}
}class Stu extends People {public username!: stringpublic age!: number;public address!: stringconstructor(username: string, age: number, address: string, public phone: string) {super();this.address = address;}study() {}
}let people = new People()//let result = people as Stu;// 类型断言 正确
let result = <Stu>people;// 类型转换 正确
result.study();let stu = new Stu("wangwu", 23, "北京", "123")
let result2 = stu as People;// 正确
(2)如果 A,B 如果是类,但没有继承关系

两个类中的任意一个类的所有的 public 实例属性【不包括静态属性】加上所有的 public 实例方法和另一个类的所有 public 实例属性加上所有的 public 实例方法完全相同或是另外一个类的子集,则这两个类可以相互断言,否则这两个类就不能相互断言。

// 类型断言中的不能相互重叠问题:
//   两个类之间断言的规则:
//   两个类中任意一个的属性和方法是另一个类的属性和方法完全相同或子集,则这两个类可以相互断言
//   否则这两个类就不能相互断言class People {constructor(public username: string, public age: number,public address: string) {}
}class Stu {public username!: stringpublic age!: number;public address!: stringpublic phone!:string;constructor(username: string, age: number, address: string) {this.address = address;}
}let people = new People("wangwu", 23, "beijing")
let stuedConvert = people as Stu;
let stu = new Stu("wangwu", 23, "北京")
let peopledConvert = stu as People;
(3)如果 A 是类,B 是接口,并且 A 类实现了 B 接口【implements】,则A 的对象变量可以断言成 B 接口类型,同样 B 接口类型的对象变量也可以断言成A类型 。
interface People {username: string, age: number, address: string, phone: string
}class Stu implements People {public username!: stringpublic age!: number;public address!: stringpublic phone!: stringpublic kk() {}constructor(username: string, age: number, address: string) {this.address = address;}
}let people: People = { username: "wangwu", age: 23, address: "11", phone: "111" }
let result = people as Stu;//正确
let result2 = <Stu>people;// 类型转换 正确let stu = new Stu("wangwu", 23, "北京")
stu as People;// 正确
(4)如果 A 是类,B 是接口,并且 A 类没有实现了 B 接口,则断言关系和第2项的规则完全相同。
interface People {username: string, age: number, address: string, phone: string
}class Stu {public username!: stringpublic age!: number;public address!: stringpublic phone!: stringpublic kk() {}constructor(username: string, age: number, address: string) {this.address = address;}
}let people: People = { username: "wangwu", age: 23, address: "11", phone: "111" }
let result = people as Stu;//正确let stu = new Stu("wangwu", 23, "北京")
stu as People;// 正确
(5)如果 A 是类,B 是 type 定义的数据类型

type 定义的数据类型是引用数据类型,例如 Array, 对象,不能是基本数据类型,例如 string,number,boolean,并且有 A 类实现了 B type 定义的数据类型【 implements】,则 A 的对象变量可以断言成 B type 定义的对象数据类型,同样 B type 定义的对象数据类型的对象变量也可以断言成 A 类型 。

type People = {username: string, age: number, address: string, phone: string
}class Stu implements People {public username!: stringpublic age!: number;public address!: stringpublic phone!: stringconstructor(username: string, age: number, address: string) {this.address = address;}
}let people: People = { username: "wangwu", age: 23, address: "11", phone: "111" }
let result = people as Stu;//正确let stu = new Stu("wangwu", 23, "北京")
stu as People;// 正确
(6)如果 A 是类,B 是 type 定义的数据类型,并且 A 类没有实现 B type定义的数据类型,则断言关系和第2项的规则完全相同。
type People = {username: string, age: number, address: string, phone: string
}
class Stu {public username!: stringpublic age!: number;public address!: stringconstructor(username: string, age: number, address: string) {this.address = address;}
}let people: People = { username: "wangwu", age: 23, address: "11", phone: "111" }
let result = people as Stu;//正确let stu = new Stu("wangwu", 23, "北京")
stu as People;// 正确
(7)如果 A 是一个函数上参数变量的联合类型,例如 string |number,那么在函数内部可以断言成 string 或number 类型。
function selfMutiply(one: string | number) {one as number +3;
}
(8)多个类组成的联合类型断言

例如:let vechile: Car | Bus | Trunck。 vechile 可以断言成其中任意一种数据类型。 例如 vechile as Car, vechile as Bus , vechile as Trunck 。

class Vechile {static count: number = 3;public brand: string;public vechileNo: string;public days: number;public total: number = 0;public deposit: number;constructor(brand_: string, vechileNo_: string, days_: number, deposit_: number) {this.brand = brand_;this.vechileNo = vechileNo_;this.days = days_;this.deposit = deposit_;}public calculateRent() {}payDesposit() {}public safeShow() {}
}class Car extends Vechile {public type: string;constructor(brand_: string, vechileNo_: string, days_: number,deposit_: number, type_: string) {super(brand_, vechileNo_, days_, deposit_);this.type = type_;}public getPriceByType() {}public calculateRent() {}public checkIsWeigui(isOverWeight: boolean) {}
}class Bus extends Vechile {public seatNum: numberconstructor(brand_: string, vechileNo_: string, days_: number,deposit_: number, seatNum_: number) {super(brand_, vechileNo_, days_, deposit_);this.seatNum = seatNum_;}public getPriceBySeatNum() {}public checkIsOverNum(isOverWeight: boolean) {}
}class Truck extends Vechile {ton!: numberconstructor(brand_: string, type_: string,days_: number, deposit_: number, ton_: number) {super(brand_, type_, days_, deposit_);this.ton = ton_;}checkIsOverWeight(isOverWeight: boolean) {}CalRentPrice() {}public calRent() {}public calDesposit() {}
}class Customer {rentVechile(vechile:Bus | Truck | Car) {// 下面进行断言、转换//<Bus>vechile <==等同==> vechile as Bus//vechile as unknown//vechile.calculateRent()//(vechile as Bus).checkIsOverNum(false)}
}
(9)任何数据类型都可以转换成 any 或 unknown 类型**,any 或 unknown 类型也可以转换成任何其他数据类型。
function add(one: string | number, two: string | number) {return one as any + two as any
}console.log(add(3, 5))
console.log(add("3", 5))
4.类型断言存在的意义和应用场景:

场景1:顾客在执行汽车租赁项目租赁价格计算方法中调用每一个类的独有方法时使用

场景2:对象中的 Symbol 数据类型取值问题

场景3:加法计算,巧用 as any。

let symid = Symbol("objid")
let obj = { [symid]: 101, username: "wangwu", age: 23 }
let username = obj["username"]
//let objid=obj[symid]//类型“symbol”不能作为索引类型使用
// 解决:
let objid = obj[symid as any]
//let objid2 = obj[symid as unknown]//类型“unknown”不能作为索引类型使用
//let symidunknown = symid as unknown// 可以转换成unknown,正确

脚踏实地行,海阔天空飞

相关文章:

TS中断言、转换的应用

1.TS 类型断言定义 把两种能有重叠关系的数据类型进行相互转换的一种 TS 语法&#xff0c;把其中的一种数据类型转换成另外一种数据类型。类型断言和类型转换产生的效果一样&#xff0c;但语法格式不同。 2.TS 类型断言语法格式 A 数据类型的变量 as B 数据类型 。 A 数据类…...

【代码随想录算法训练营-第四天】【链表】24,19, 面试题 02.07,142

24. 两两交换链表中的节点 第一遍-递归-小看了一下题解 思路&#xff1a; 读了两遍题目才理解…相邻节点的交换&#xff0c;这个操作很容易实现&#xff0c;但需要一个tmpNode因为是链表的题目&#xff0c;没开始思考之前先加了dummyNode&#xff0c;还真管用把dummyNode作为…...

代理设计模式

1. 代理模式 1.1 代理模式的原理分析 代理设计模式&#xff08;Proxy Design Pattern&#xff09;是一种结构型设计模式&#xff0c;它为其他对象提供一个代理对象&#xff0c;以控制对这个对象的访问。代理模式可以用于实现懒加载、安全访问控制、日志记录等功能。 代理模式…...

ubuntu安装docker及docker常用命令

docker里有三个部分 daemon 镜像 和 容器 我们需要了解的概念 容器 镜像 数据卷 文章目录 docker命令docker镜像相关命令docker容器相关命令数据卷ubuntu安装docker docker命令 #启动&#xff0c;停止&#xff0c;重启docker systemctl start docker systemctl stop docker s…...

STM32-TIM定时器输出比较

目录 一、输出比较简介 二、PWM简介 三、输出比较通道&#xff08;通用&#xff09; 四、输出比较通道&#xff08;高级&#xff09; 五、输出比较模式 六、PWM基本结构 七、PWM参数计算 八、外设介绍 8.1 舵机 8.2 直流电机及驱动 九、开发步骤 十、输出比较库函数…...

《Easy3d+Qt+VTK》学习

《Easy3dQtVTK》学习-1、编译与配置 一、编译二、配置注 一、编译 1、 资源下载&#xff1a;easy3d giuhub 2、解压缩 3、用qt打开CMakeLists.txt即可 4、点击项目&#xff0c;选择debug或者release&#xff0c;图中3处可自行选择&#xff0c;因为我的qt版本是6&#xff0c…...

多平台展示预约的服装小程序效果如何

线下实体服装店非常多&#xff0c;主要以同城生意为主&#xff0c;但随着电商经济增长&#xff0c;传统线下自然流量变少&#xff0c;商家们会选择线上入驻平台开店获得更多线上用户&#xff0c;包括自建私域小程序等。 而除了直接卖货外&#xff0c;线上展示预约在服装行业也…...

Gti GUI添加标签

通过Git Gui打开项目&#xff0c;通过菜单打开分支历史&#xff0c;我这里是名为"develop"的分支 选中需要打标签的commit&#xff0c;右键-Create tag即可 但貌似无法删除标签&#xff0c;只能通过git bash&#xff0c;本地标签通过git tag -d tagname&#xff0c;…...

高云GW1NSR-4C开发板M3硬核应用

1.M3硬核IP下载&#xff1a;Embedded M3 Hard Core in GW1NS-4C - 科技 - 广东高云半导体科技股份有限公司 (gowinsemi.com.cn) 特别说明&#xff1a;IDE必须是1.9.9及以后版本&#xff0c;1.9.8会导致编译失败&#xff08;1.9.8下1.1.3版本IP核可用&#xff09; 以下根据官方…...

【RTOS学习】模拟实现任务切换 | 寄存器和栈的变化

&#x1f431;作者&#xff1a;一只大喵咪1201 &#x1f431;专栏&#xff1a;《RTOS学习》 &#x1f525;格言&#xff1a;你只管努力&#xff0c;剩下的交给时间&#xff01; 目录 &#x1f3c0;认识任务切换&#x1f3d0;切换的实质&#x1f3d0;栈中的内容&#x1f3d0;切…...

1.2 轻量级数据交互格式–JSON

对于接口来说,数据交互大部分都是使用的JSON格式,我们这里说的数据,就是我们上一章里讲解HTTP协议的时候,HTTP协议结构里的实体,也就是放在body里。body里存放需要传输的数据,数据是JSON格式,然后通过HTTP协议来传输给接口,接口再以同样的方式给我们返回。理解了这一层…...

charCodeAt() 方法

charCodeAt() 是 JavaScript 中用于获取字符串指定位置字符的 Unicode 编码的方法 语法如下&#xff1a; str.charCodeAt(index) str&#xff1a;要获取字符的字符串。index&#xff1a;要获取的字符在字符串中的索引。返回值是一个表示给定索引处字符 Unicode 编码的整数。…...

Flask中redis的配置与使用

注意点&#xff1a; 在__init__.py中需要将redis_store设置成全局变量&#xff0c;这样方便其他文件导入 一、config.py import logging import os from datetime import timedeltafrom redis import StrictRedisclass Config:# 调试信息DEBUG TrueSECRET_KEY os.urandom(3…...

生产者与消费者模型

初识linux之线程同步与生产者消费者模型_生产者线程和消费者线程-CSDN博客 Linux线程&#xff08;三&#xff09;—— 多线程&#xff08;生产者消费者模型、信号量、线程池&#xff09;-CSDN博客...

透析回溯的模板

关卡名 认识回溯思想 我会了✔️ 内容 1.复习递归和N叉树&#xff0c;理解相关代码是如何实现的 ✔️ 2.理解回溯到底怎么回事 ✔️ 3.掌握如何使用回溯来解决二叉树的路径问题 ✔️ 回溯可以视为递归的拓展&#xff0c;很多思想和解法都与递归密切相关&#xff0c;在很多…...

浅谈web性能测试

什么是性能测试&#xff1f; web性能应该注意些什么&#xff1f; 性能测试&#xff0c;简而言之就是模仿用户对一个系统进行大批量的操作&#xff0c;得出系统各项性能指标和性能瓶颈&#xff0c;并从中发现存在的问题&#xff0c;通过多方协助调优的过程。而web端的性能测试…...

Qt 容器QGroupBox带有标题的组框框架

控件简介 QGroupBox 小部件提供一个带有标题的组框框架。一般与一组或者是同类型的部件一起使用。教你会用,怎么用的强大就靠你了靓仔、靓妹。 用法示例 例 qgroupbox,组框示例(难度:简单),使用 3 个 QRadioButton 单选框按钮,与QVBoxLayout(垂直布局)来展示组框的…...

Linux系统解决“Key was rejected by service”

Linux系统下加载驱动模块出现如上错误提示的原因为&#xff1a;此驱动未经过签名。 方法一、关闭Secure Boot 如果是物理机&#xff0c;需要开机进入BIOS&#xff0c;找到“Secure Boot”的选项&#xff0c;然后关闭。 如果是虚拟机&#xff0c;可以打开虚拟设置&#xff0c…...

【C++ Primer Plus学习记录】字符函数库cctype

C从C语言继承了一个与字符相关的、非常方便的函数软件包&#xff0c;它可以简化诸如确定字符是否为大写字母、数字、标点符号等工作&#xff0c;这些函数的原型是在头文件cctype中定义的。 cctype中的字符函数 函数名称返回值isalnum()如果参数是字母或数字&#xff0c;该函数返…...

C# WebSocket简单使用

文章目录 前言Fleck调试工具初始化简单使用 前言 最近接到了一个需求&#xff0c;需要网页实现上位机的功能。那就对数据传输的实时性要求很高。那就只能用WebSocket了。这里简单说一下我的WebSocket如何搭建 Fleck C# WebSocket(Fleck) 客户端:html Winfrom Fleck Github官网…...

Spring Boot 实现流式响应(兼容 2.7.x)

在实际开发中&#xff0c;我们可能会遇到一些流式数据处理的场景&#xff0c;比如接收来自上游接口的 Server-Sent Events&#xff08;SSE&#xff09; 或 流式 JSON 内容&#xff0c;并将其原样中转给前端页面或客户端。这种情况下&#xff0c;传统的 RestTemplate 缓存机制会…...

【网络安全产品大调研系列】2. 体验漏洞扫描

前言 2023 年漏洞扫描服务市场规模预计为 3.06&#xff08;十亿美元&#xff09;。漏洞扫描服务市场行业预计将从 2024 年的 3.48&#xff08;十亿美元&#xff09;增长到 2032 年的 9.54&#xff08;十亿美元&#xff09;。预测期内漏洞扫描服务市场 CAGR&#xff08;增长率&…...

Mac下Android Studio扫描根目录卡死问题记录

环境信息 操作系统: macOS 15.5 (Apple M2芯片)Android Studio版本: Meerkat Feature Drop | 2024.3.2 Patch 1 (Build #AI-243.26053.27.2432.13536105, 2025年5月22日构建) 问题现象 在项目开发过程中&#xff0c;提示一个依赖外部头文件的cpp源文件需要同步&#xff0c;点…...

Java + Spring Boot + Mybatis 实现批量插入

在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法&#xff1a;使用 MyBatis 的 <foreach> 标签和批处理模式&#xff08;ExecutorType.BATCH&#xff09;。 方法一&#xff1a;使用 XML 的 <foreach> 标签&#xff…...

STM32---外部32.768K晶振(LSE)无法起振问题

晶振是否起振主要就检查两个1、晶振与MCU是否兼容&#xff1b;2、晶振的负载电容是否匹配 目录 一、判断晶振与MCU是否兼容 二、判断负载电容是否匹配 1. 晶振负载电容&#xff08;CL&#xff09;与匹配电容&#xff08;CL1、CL2&#xff09;的关系 2. 如何选择 CL1 和 CL…...

Ubuntu系统复制(U盘-电脑硬盘)

所需环境 电脑自带硬盘&#xff1a;1块 (1T) U盘1&#xff1a;Ubuntu系统引导盘&#xff08;用于“U盘2”复制到“电脑自带硬盘”&#xff09; U盘2&#xff1a;Ubuntu系统盘&#xff08;1T&#xff0c;用于被复制&#xff09; &#xff01;&#xff01;&#xff01;建议“电脑…...

VisualXML全新升级 | 新增数据库编辑功能

VisualXML是一个功能强大的网络总线设计工具&#xff0c;专注于简化汽车电子系统中复杂的网络数据设计操作。它支持多种主流总线网络格式的数据编辑&#xff08;如DBC、LDF、ARXML、HEX等&#xff09;&#xff0c;并能够基于Excel表格的方式生成和转换多种数据库文件。由此&…...

React核心概念:State是什么?如何用useState管理组件自己的数据?

系列回顾&#xff1a; 在上一篇《React入门第一步》中&#xff0c;我们已经成功创建并运行了第一个React项目。我们学会了用Vite初始化项目&#xff0c;并修改了App.jsx组件&#xff0c;让页面显示出我们想要的文字。但是&#xff0c;那个页面是“死”的&#xff0c;它只是静态…...

ArcGIS Pro+ArcGIS给你的地图加上北回归线!

今天来看ArcGIS Pro和ArcGIS中如何给制作的中国地图或者其他大范围地图加上北回归线。 我们将在ArcGIS Pro和ArcGIS中一同介绍。 1 ArcGIS Pro中设置北回归线 1、在ArcGIS Pro中初步设置好经纬格网等&#xff0c;设置经线、纬线都以10间隔显示。 2、需要插入背会归线&#xf…...

HTTPS证书一年多少钱?

HTTPS证书作为保障网站数据传输安全的重要工具&#xff0c;成为众多网站运营者的必备选择。然而&#xff0c;面对市场上种类繁多的HTTPS证书&#xff0c;其一年费用究竟是多少&#xff0c;又受哪些因素影响呢&#xff1f; 首先&#xff0c;HTTPS证书通常在PinTrust这样的专业平…...