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

TypeScript之泛型

一、是什么

泛型程序设计(generic programming)是程序设计语言的一种风格或范式

泛型允许我们在强类型程序设计语言中编写代码时使用一些以后才指定的类型,在实例化时作为参数指明这些类型 在typescript中,定义函数,接口或者类的时候,不预先定义好具体的类型,而在使用的时候在指定类型的一种特性

假设我们用一个函数,它可接受一个 number 参数并返回一个number 参数,如下写法:

function returnItem (para: number): number {return para
}

如果我们打算接受一个 string 类型,然后再返回 string类型,则如下写法:

function returnItem (para: string): string {return para
}

上述两种编写方式,存在一个最明显的问题在于,代码重复度比较高

虽然可以使用 any类型去替代,但这也并不是很好的方案,因为我们的目的是接收什么类型的参数返回什么类型的参数,即在运行时传入参数我们才能确定类型

这种情况就可以使用泛型,如下所示:

function returnItem<T>(para: T): T {return para
}

可以看到,泛型给予开发者创造灵活、可重用代码的能力

二、使用方式

泛型通过<>的形式进行表述,可以声明:

  • 函数

  • 接口

函数声明

声明函数的形式如下:

function returnItem<T>(para: T): T {return para
}

定义泛型的时候,可以一次定义多个类型参数,比如我们可以同时定义泛型 T 和 泛型 U

function swap<T, U>(tuple: [T, U]): [U, T] {return [tuple[1], tuple[0]];
}swap([7, 'seven']); // ['seven', 7]

接口声明

声明接口的形式如下:

interface ReturnItemFn<T> {(para: T): T
}

那么当我们想传入一个number作为参数的时候,就可以这样声明函数:

const returnItem: ReturnItemFn<number> = para => para

类声明

使用泛型声明类的时候,既可以作用于类本身,也可以作用与类的成员函数

下面简单实现一个元素同类型的栈结构,如下所示:

class Stack<T> {private arr: T[] = []public push(item: T) {this.arr.push(item)}public pop() {this.arr.pop()}
}

使用方式如下:

const stack = new Stacn<number>()

如果上述只能传递 string 和 number 类型,这时候就可以使用 <T extends xx> 的方式猜实现约束泛型,如下所示:

除了上述的形式,泛型更高级的使用如下:

例如要设计一个函数,这个函数接受两个参数,一个参数为对象,另一个参数为对象上的属性,我们通过这两个参数返回这个属性的值

这时候就设计到泛型的索引类型和约束类型共同实现

索引类型、约束类型

索引类型 keyof T 把传入的对象的属性类型取出生成一个联合类型,这里的泛型 U 被约束在这个联合类型中,如下所示:

function getValue<T extends object, U extends keyof T>(obj: T, key: U) {return obj[key] // ok
}

上述为什么需要使用泛型约束,而不是直接定义第一个参数为 object类型,是因为默认情况 object 指的是{},而我们接收的对象是各种各样的,一个泛型来表示传入的对象类型,比如 T extends object

使用如下图所示:

多类型约束

例如如下需要实现两个接口的类型约束:

interface FirstInterface {doSomething(): number
}interface SecondInterface {doSomethingElse(): string
}

可以创建一个接口继承上述两个接口,如下:

interface ChildInterface extends FirstInterface, SecondInterface {}

正确使用如下:

class Demo<T extends ChildInterface> {private genericProperty: Tconstructor(genericProperty: T) {this.genericProperty = genericProperty}useT() {this.genericProperty.doSomething()this.genericProperty.doSomethingElse()}
}

通过泛型约束就可以达到多类型约束的目的

三、应用场景

通过上面初步的了解,后述在编写 typescript 的时候,定义函数,接口或者类的时候,不预先定义好具体的类型,而在使用的时候在指定类型的一种特性的时候,这种情况下就可以使用泛型

灵活的使用泛型定义类型,是掌握typescript 必经之路

相关文章:

TypeScript之泛型

一、是什么 泛型程序设计&#xff08;generic programming&#xff09;是程序设计语言的一种风格或范式 泛型允许我们在强类型程序设计语言中编写代码时使用一些以后才指定的类型&#xff0c;在实例化时作为参数指明这些类型 在typescript中&#xff0c;定义函数&#xff0c;…...

一个小妙招从Prompt菜鸟秒变专家!加州大学提出PromptAgent,帮你高效使用ChatGPT!

夕小瑶科技说 原创 作者 | 谢年年、王二狗 有了ChatGPT、GPT4之后&#xff0c;我们的工作学习效率得到大大提升&#xff08;特别在凑字数方面୧(๑•̀◡•́๑)૭&#xff09;。 作为一个工具&#xff0c;有人觉得好用&#xff0c;自然也有人觉得难用。 要把大模型用得6&am…...

Netty通信框架

Netty框架的底层是NIO&#xff0c;NIO&#xff1a;non-blocking io 非阻塞IO 一个线程可以处理多个通道&#xff0c;减少线程创建数量&#xff1b; 读写非阻塞&#xff0c;节约资源&#xff1a;没有可读&#xff0f;可写数据时&#xff0c;不会发生阻塞导致线程资源的浪费 一…...

6西格玛质量标准: 提升业务效率的关键

在现代竞争激烈的商业环境中&#xff0c;企业需要不断提高效率&#xff0c;降低成本&#xff0c;同时确保产品和服务的质量。为了达到这个目标&#xff0c;许多企业已经转向了6西格玛质量标准。这个方法旨在通过最小化缺陷和提高流程稳定性来优化业务运作&#xff0c;为客户提供…...

OpenGL ES相关库加载3D 车辆模型

需求类似奇瑞的这个效果&#xff0c;就是能全方位旋转拖拽看车&#xff0c;以及点击开关车门车窗后备箱等 瑞虎9全景看车 (chery.cn) 最开始收到这个需求的时候还有点无所适从&#xff0c;因为以前没有做过类似的效果&#xff0c;后面一经搜索后发现实现的方式五花八门&#xf…...

云原生环境下JAVA应用容器JVM内存如何配置?—— 筑梦之路

Docker环境下的JVM参数非定值配置 —— 筑梦之路_docker jvm设置-CSDN博客 之前简单地记录过一篇&#xff0c;这里在之前的基础上更加细化一下。 场景说明 使用Java开发且设置的JVM堆空间过小时&#xff0c;程序会出现系统内存不足OOM&#xff08;Out of Memory&#xff09;的…...

防雷接地测试方法完整方案

防雷接地是保障电力系统、电子设备和建筑物安全的重要措施&#xff0c;防雷接地测试是检验防雷接地装置是否合格的必要手段。本文介绍了防雷接地测试的原理、方法和注意事项&#xff0c;以及如何编写防雷接地测试报告。 地凯科技防雷接地测试的原理 防雷接地测试的基本原理是…...

【云原生-K8s】Kubernetes安全组件CIS基准kube-beach安装及使用

基础介绍kube-beach介绍kube-beach 下载百度网盘下载wget下载 kube-beach安装kube-beach使用基础参数示例结果说明 基础介绍 为了保证集群以及容器应用的安全&#xff0c;Kubernetes 提供了多种安全机制&#xff0c;限制容器的行为&#xff0c;减少容器和集群的攻击面&#xf…...

玩家必备,2款顶级游戏录屏软件!

“游戏怎么录屏呀&#xff1f;最近迷上了网游&#xff0c;觉得自己的游戏技术挺厉害的&#xff0c;想把游戏视频录下来出一个教程&#xff0c;方便给朋友进行参考&#xff0c;但是我不会录屏&#xff0c;大家有没有游戏录屏的软件或者方法推荐一下。” 随着游戏产业的飞速发展…...

七、W5100S/W5500+RP2040树莓派Pico<UDP 组播>

文章目录 1. 前言2. 相关简介2.1 简述2.2 优点2.3 应用 3. WIZnet以太网芯片4. UDP 组播回环测试4.1 程序流程图4.2 测试准备4.3 连接方式4.4 相关代码4.5 测试现象 5. 注意事项6. 相关链接 1. 前言 UDP组播是一种基于UDP协议的通信方式&#xff0c;它允许一台计算机通过发送单…...

Wonder3D:用单张图片生成纹理网格

Wonder3D 只需 2 ∼ 3 分钟即可从单视图图像重建高度详细的纹理网格。 Wonder3D首先通过跨域扩散模型生成一致的多视图法线图和相应的彩色图像&#xff0c;然后利用新颖的法线融合方法实现快速、高质量的重建。 推荐&#xff1a;用 NSDT编辑器 快速搭建可编程3D场景 1、推理准…...

macOS 创建Flutter项目

参考在 macOS 上安装和配置 Flutter 开发环境 - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter 这个文档&#xff0c;配置好flutter的环境 编辑器可以选择vscode或者IDEA。 我这里以IDEA为例 打开 IDE 并选中 New Flutter Project。 选择 Flutter&#xff0c;验证 F…...

【微服务 Spring Cloud Alibaba】- Nacos 服务注册中心

目录 1. 什么是注册中心&#xff1f; 1.2 注册中心的作用 2. SpringBoot 整合 Nacos 实现服务注册中心 2.1 将服务注册到 Nacos 2.2 实现消费者 3. 服务列表各个参数的含义、作用以及应用场景 1. 什么是注册中心&#xff1f; 注册中心是微服务架构中的一个重要组件&…...

windows openssl安装和基本使用

OpenSSL使用 私钥和证书文件 openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -sha256 -days 365这是一个使用OpenSSL命令行工具生成自签名X.509证书的命令。通过执行该命令&#xff0c;您将生成一个4096位RSA密钥对&#xff0c;并使用该密钥对生成一个自…...

Qt Concurrent框架详解(QFuture、QFutureWatcher)

1.概述 Qt Concurrent是Qt提供的一个并发编程框架&#xff0c;用于简化多线程和并行计算的开发。它提供了一组易于使用的函数和类&#xff0c;可以方便地在多线程环境下处理并发任务。 有以下特点&#xff1a; 简单易用&#xff1a;Qt Concurrent提供了一组高级函数和类&…...

zip函数用法:解压与打包

解释 在 Python 中&#xff0c;zip 函数可以用于两种情况&#xff1a;打包&#xff08;压缩&#xff09;和解压&#xff08;解包&#xff09;。 1.打包&#xff08;压缩&#xff09;&#xff1a; 当传递多个可迭代对象作为参数给 zip 函数时&#xff0c;它会将这些可迭代对象…...

这一份免费API接口集合,开发者必备

台风信息查询&#xff1a;提供西北太平洋及南海地区过去两年及当前年份所有编号台风的信息查询&#xff0c;包括台风实时位置、过去路径、预报路径及登陆信息等要素。未来7天生活指数&#xff1a;支持国内3400个城市以及国际4万个城市的天气指数数据&#xff0c;包括晨练、洗车…...

【IDEA】设置sql提示

第一步&#xff1a;注入SQL语言 1.首先选择任意一条sql语句&#xff0c;右击&#xff0c;选择 ‘显示上下文操作’ 2.选择 ‘注入语言或引用’ 3. 往下翻&#xff0c;找到MySQL 第二步&#xff1a;配置MySQL数据库连接 1.首先点击侧边的数据库&#xff0c;再点击上面的加号 2…...

Swagger + DOCWAY 一步导出为优雅完整的Markdown、Pdf接口文档

只要开发&#xff0c;只要写接口应该没人不知道Swagger&#xff0c;但DOCWAY可能知道的人不多&#xff0c;但知道用过后就离不开了&#xff0c;不管是作为多方联调的接口文档&#xff0c;还是交接给客户的文档&#xff0c;都是可以的&#xff0c;具体如何使用&#xff0c;详细步…...

HTML链接、头部

HTML链接&#xff1a; HTML使用超级链接与网络上的另一个文档相连。HTML中的链接是一种用于在不同网页之间的导航的元素。链接通常用于将一个网页与另一个网页或资源&#xff08;文档、图像、音频文件等&#xff09;相关联。链接允许用户在浏览网页时单击文本或图像来跳转到其他…...

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

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

在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中,手势开发全攻略:

在 HarmonyOS 应用开发中&#xff0c;手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力&#xff0c;既支持点击、长按、拖拽等基础单一手势的精细控制&#xff0c;也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档&#xff0c…...

HTML 列表、表格、表单

1 列表标签 作用&#xff1a;布局内容排列整齐的区域 列表分类&#xff1a;无序列表、有序列表、定义列表。 例如&#xff1a; 1.1 无序列表 标签&#xff1a;ul 嵌套 li&#xff0c;ul是无序列表&#xff0c;li是列表条目。 注意事项&#xff1a; ul 标签里面只能包裹 li…...

Robots.txt 文件

什么是robots.txt&#xff1f; robots.txt 是一个位于网站根目录下的文本文件&#xff08;如&#xff1a;https://example.com/robots.txt&#xff09;&#xff0c;它用于指导网络爬虫&#xff08;如搜索引擎的蜘蛛程序&#xff09;如何抓取该网站的内容。这个文件遵循 Robots…...

令牌桶 滑动窗口->限流 分布式信号量->限并发的原理 lua脚本分析介绍

文章目录 前言限流限制并发的实际理解限流令牌桶代码实现结果分析令牌桶lua的模拟实现原理总结&#xff1a; 滑动窗口代码实现结果分析lua脚本原理解析 限并发分布式信号量代码实现结果分析lua脚本实现原理 双注解去实现限流 并发结果分析&#xff1a; 实际业务去理解体会统一注…...

【论文阅读28】-CNN-BiLSTM-Attention-(2024)

本文把滑坡位移序列拆开、筛优质因子&#xff0c;再用 CNN-BiLSTM-Attention 来动态预测每个子序列&#xff0c;最后重构出总位移&#xff0c;预测效果超越传统模型。 文章目录 1 引言2 方法2.1 位移时间序列加性模型2.2 变分模态分解 (VMD) 具体步骤2.3.1 样本熵&#xff08;S…...

mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包

文章目录 现象&#xff1a;mysql已经安装&#xff0c;但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时&#xff0c;可能是因为以下几个原因&#xff1a;1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...

CMake控制VS2022项目文件分组

我们可以通过 CMake 控制源文件的组织结构,使它们在 VS 解决方案资源管理器中以“组”(Filter)的形式进行分类展示。 🎯 目标 通过 CMake 脚本将 .cpp、.h 等源文件分组显示在 Visual Studio 2022 的解决方案资源管理器中。 ✅ 支持的方法汇总(共4种) 方法描述是否推荐…...

【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习

禁止商业或二改转载&#xff0c;仅供自学使用&#xff0c;侵权必究&#xff0c;如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...

Java线上CPU飙高问题排查全指南

一、引言 在Java应用的线上运行环境中&#xff0c;CPU飙高是一个常见且棘手的性能问题。当系统出现CPU飙高时&#xff0c;通常会导致应用响应缓慢&#xff0c;甚至服务不可用&#xff0c;严重影响用户体验和业务运行。因此&#xff0c;掌握一套科学有效的CPU飙高问题排查方法&…...