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

TypeScript 泛型的深入解析与基本使用

系列文章目录


文章目录

  • 系列文章目录
  • 前言
  • 一、泛型的概念
  • 二、泛型函数
  • 三、泛型类
  • 四、泛型接口
  • 五、泛型约束
  • 总结


前言

泛型是TypeScript中的一个重要概念,它允许我们在定义函数、类或接口时使用参数化类型,增强了代码的灵活性和重用性。本文将深入探讨泛型的概念,以及如何在TypeScript中进行基本的泛型使用。


一、泛型的概念

泛型(Generics)是指在定义函数、类或接口时,不预先指定具体的数据类型,而是在使用时才指定数据类型。这种灵活的参数化类型能够增强代码的通用性和复用性,使代码更具弹性。

二、泛型函数

在函数中使用泛型,可以实现在多种数据类型上执行相同的操作。例如,下面是一个简单的泛型函数,用于交换两个变量的值:

function swap<T>(a: T, b: T): void {let temp: T = a;a = b;b = temp;
}let x = 5, y = 10;
swap(x, y);
console.log(x, y); // 输出 10 5

三、泛型类

与函数一样,类也可以使用泛型。例如,我们可以创建一个泛型的Pair类,用于存储一对值:

class Pair<T, U> {constructor(public first: T, public second: U) {}
}let pair = new Pair<number, string>(1, 'hello');
console.log(pair.first, pair.second); // 输出 1 hello

四、泛型接口

泛型也可以用于接口的定义。例如,下面是一个泛型接口,用于定义一个通用的栈数据结构:

interface Stack<T> {push(item: T): void;pop(): T;
}class NumberStack implements Stack<number> {private items: number[] = [];push(item: number): void {this.items.push(item);}pop(): number {return this.items.pop();}
}

五、泛型约束

有时候,我们希望对泛型进行一定的约束,以确保其满足特定条件。例如,我们可以为泛型函数添加一个约束,使其仅接受包含length属性的参数:

function printLength<T extends { length: number }>(item: T): void {console.log(item.length);
}printLength('hello'); // 输出 5
printLength([1, 2, 3]); // 输出 3

总结

通过本文,你已经了解了TypeScript中泛型的概念以及基本使用方法。泛型能够让你的代码更加灵活,使其可以适应不同类型的数据。

希望本文对你在学习和使用TypeScript泛型时有所帮助。如果你有任何问题或疑问,欢迎留言讨论。感谢阅读!

相关文章:

TypeScript 泛型的深入解析与基本使用

系列文章目录 文章目录 系列文章目录前言一、泛型的概念二、泛型函数三、泛型类四、泛型接口五、泛型约束总结 前言 泛型是TypeScript中的一个重要概念&#xff0c;它允许我们在定义函数、类或接口时使用参数化类型&#xff0c;增强了代码的灵活性和重用性。本文将深入探讨泛型…...

【Terraform学习】保护敏感变量(Terraform配置语言学习)

实验步骤 创建 EC2 IAM 角色 导航到IAM 在左侧菜单中&#xff0c;单击角色 。单击创建角色该按钮以创建新的 IAM 角色。 在创建角色部分&#xff0c;为角色选择可信实体类型&#xff1a; AWS 服务 使用案例:EC2 单击下一步 添加权限&#xff1a;现在&#xff0c;您可以看到…...

海国图志#1:这一周难忘瞬间,吐血整理,不得不看

这里记录每周值得分享的新闻大图&#xff0c;周日发布。 文章以高清大图呈现&#xff0c;解说以汉语为主&#xff0c;英语为辅&#xff0c;英语句子均来自NYTimes、WSJ、The Guardian等权威媒体原刊。 存档时段&#xff1a;20230731-20230806 乌克兰&#xff0c;波罗当卡 一名妇…...

【Android】okhttp爆java.lang.IllegalStateException: closed的解决方法

解决 java.lang.IllegalStateException: closed异常通常是由于OkHttp中的Response对象在调用response.body().string()后被关闭而导致的。 在代码中&#xff0c;在onResponse()方法中如果两次调用了response.body().string()&#xff0c;每次调用都会消耗掉响应体并关闭Respo…...

Django之定时任务--apscheduler

Django--定时任务apscheduler的使用 apscheduler定时任务的使用1、安装包2、配置settings.py3、在manage.py的文件同级目录下创建文件scheduler.py4、在项目的urls.py中调用这个定时计划5、然后启动项目 python manage.py runserver,在admin中查看就能看到你的定时任务及执行的…...

Spring Boot 项目应用消息服务器RabbitMQ(简单介绍)

一、背景 本章讲述的是在用户下单环节&#xff0c;消息服务器RabbitMQ 的应用 1.1 消息服务器的应用 在写一个电商项目的小demo&#xff0c;在电商项目中&#xff0c;消息服务器的应用&#xff1a; 1、订单状态通知&#xff1a;当用户下单、支付成功、订单发货、订单完成等…...

HBuilderX

HX 简介下载安装 简介 HBuilderX 是一款由 DCloud 开发的集成开发环境 (IDE)&#xff0c;主要用于前端开发和移动应用开发。它基于 Visual Studio Code 平台&#xff0c;针对 Web 开发、小程序开发、移动端开发等提供了丰富的功能和插件。 DCloud官网: https://www.dcloud.io …...

C数据结构与算法——常见排序算法时间复杂度比较 应用

实验任务 (1) 掌握常见比较排序算法的实现&#xff1b; (2) 掌握常用比较排序算法的性能及其适用场合。 实验内容 (1) 平均时间复杂度O(n2)和O(nlog2n)的算法至少各选两种实现&#xff1b; (2) 待排序的无重复关键字存放在一维整型数组中&#xff0c;数量为60000个&#xff…...

C++并发多线程--死锁问题及解决方法

1--死锁问题 死锁问题&#xff1a;两个线程访问资源时加锁&#xff0c;但都需要对方的资源才能执行释放锁&#xff1b; 代码实例&#xff1a;下面的代码中&#xff0c;当线程 1 使用 my_mutex1 上锁后&#xff0c;会继续使用 my_mutex2 进行上锁&#xff0c;若此时线程 2 已经使…...

【Spring】纯注解开发

1、简介 在Spring3.0升级了纯注解开发模式&#xff0c;使用Java类来代替配置文件&#xff0c;开启了Spring快速开发赛道。 2、定义bean Component Service Controller Repository 3、纯注解开发 使用Configuration声明一个配置类&#xff0c;使用ComponentScan来扫描作为bea…...

【算法心得】正确估计dfs时间复杂度;剪枝优化不怕重构

https://leetcode.cn/problems/verbal-arithmetic-puzzle/ 这题看到题&#xff0c;“表达式中使用的不同字符数最大为 10”&#xff0c;就觉得dfs就完事了&#xff0c;最多不过10!&#xff0c;10!才1e6&#xff0c;1e7这样。如果字符再少点&#xff0c;6! 7! 8!的&#xff0c;…...

通过网关访问微服务,一次正常,一次不正常 (nacos配置的永久实例却未启动导致)

微服务直接访问没问题&#xff0c;通过网关访问&#xff0c;就一次正常访问&#xff0c;一次401错误&#xff0c;交替正常和出错 负载均衡试了 路由配置检查了 最后发现nacos下竟然有2个order服务实例&#xff0c;我明明只开启了一个呀 原来之前的8080端口微服务还残留&…...

div输入框的文字超过指定行数用省略号表示css

实现效果&#xff1a;超过四行用省略号表示 实现方法&#xff1a; .text{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4; // 自定义行数-webkit-box-orient: vertical; }...

STM32 F103C8T6学习笔记5:定时器输出不同占空比PWM驱动舵机旋转角度

现在学习使用STM32 F103C8T6的定时器PWM模式&#xff0c;使用PWM驱动舵机转动不同角度&#xff0c;文章提供源码&#xff0c;测试工程&#xff0c;测试动态效果图。 目录 基础原理&#xff1a; 实验目标&#xff1a; 测试视频结果&#xff1a; 测试工程下载&#xff1a; 基…...

液体神经网络:LNN是个啥概念?

一、说明 在在人工智能领域&#xff0c;神经网络已被证明是解决复杂问题的非常强大的工具。多年来&#xff0c;研究人员不断寻求创新方法来提高其性能并扩展其能力。其中一种方法是液体神经网络&#xff08;LNN&#xff09;的概念&#xff0c;这是一个利用动态计算功能的迷人框…...

开源数据库Mysql_DBA运维实战 (DCL/日志)

SQL&#xff08;Structured Query Language 即结构化查询语言&#xff09; a.DDL语句 数据库定义语言&#xff1a; 数据库&#xff0c;表&#xff0c;视图&#xff0c;索引&#xff0c;存储过程&#xff0c;函数&#xff0c;创建删除ALTER(CREATE DROP ALTER) b.DML语句 数…...

神经网络基础-神经网络补充概念-03-逻辑回归损失函数

概念 逻辑回归使用的损失函数通常是"对数损失"&#xff08;也称为"交叉熵损失"&#xff09;或"逻辑损失"。这些损失函数在训练过程中用于衡量模型预测与实际标签之间的差异&#xff0c;从而帮助模型逐步调整权重参数&#xff0c;以更好地拟合数…...

基于深度信念神经网络的矿石产量预测,基于DBN的矿石产量预测,DBN的详细原理

目录 背影 DBN神经网络的原理 DBN神经网络的定义 受限玻尔兹曼机(RBM) DBN的矿石产量预测 基本结构 主要参数 数据 MATALB代码 结果图 展望 背影 DBN是一种深度学习神经网络,拥有提取特征,非监督学习的能力,是一种非常好的分类算法,本文将DBN算法进行矿石产量预测 DB…...

JavaWeb-Filter过滤器

目录 Filter过滤器 1. Filter的生命周期 2.Filter的配置 3.拦截路径 4.拦截具体的使用 5.拦截方式配置&#xff08;资源被访问方式&#xff09; 6.FilterChain拦截链 Filter过滤器 filter是过滤器&#xff0c;相比于Servlet的发送请求&#xff0c;filter是用于拦截请求。…...

python如何实现1ms内触发两个接口请求

在Python中&#xff0c;可以通过多线程或者协程来实现1ms内触发两个接口请求。以下是两种方法的示例代码&#xff1a; 1.多线程实现&#xff1a; import threading import requestsdef send_request(url):response requests.get(url)print(response.text)# 创建两个线程&…...

告别繁琐安装:用快马平台在线环境,三步创建你的第一个网页应用

作为一个刚入门的前端开发者&#xff0c;我最近发现了一个特别适合新手快速上手的开发方式——不用下载任何软件&#xff0c;直接在浏览器里就能完成网页开发的全流程。今天想和大家分享这个超实用的发现&#xff0c;以及我是如何用它快速做出第一个网页应用的。 传统开发环境的…...

【ESP32-S3 深度实战】从小智AI底层移植到自定义LVGL表情:M5Stack CoreS3 避坑与架构指南

大家好&#xff0c;这里是企鹅的蚂蚁&#xff01; 继上一篇打通了 M5Stack CoreS3 的 LVGL 模拟器与全双工音频后&#xff0c;最近我又开启了一项“硬核战役”&#xff1a;尝试将目前非常火的“小智 AI”底层框架移植进 CoreS3&#xff0c;并且完全弃用它原生的 UI&#xff0c…...

告别密码!用SecureCRT+SSH密钥3分钟搞定Linux服务器安全登录

SecureCRT与SSH密钥&#xff1a;3分钟打造企业级Linux服务器安全登录方案 每次输入冗长密码连接服务器的繁琐操作&#xff0c;正在成为过去式。想象一下&#xff0c;当你凌晨三点紧急处理线上故障时&#xff0c;不再需要反复核对密码本或等待二次验证码——只需轻轻一点&#x…...

TranslucentTB任务栏透明化故障全解决方案:从诊断到长效维护

TranslucentTB任务栏透明化故障全解决方案&#xff1a;从诊断到长效维护 【免费下载链接】TranslucentTB A lightweight utility that makes the Windows taskbar translucent/transparent. 项目地址: https://gitcode.com/gh_mirrors/tr/TranslucentTB TranslucentTB作…...

告别残差加法,Kimi 给神经网络换了个 “智能引擎”

来源&#xff1a;算法进阶 本文约2800字&#xff0c;建议阅读6分钟本文介绍了 Kimi 团队用 Attention Residuals 替代传统残差机制的成果。只要接触深度学习神经网络的读者们对「」一定不会陌生。自从 2015 年 ResNet 诞生以来&#xff0c;这种「将输入直接加到输出上」的简单逻…...

前端开发中的加载指示器(Loading Spinners)一种动态旋转的图形元素(如圆圈、齿轮状动画)

在 Android 中&#xff0c;Spinner 是一个下拉选择控件&#xff0c;用于从预定义列表中选择一项。以下是标准、稳定、兼容性好的实现方式&#xff08;基于 ViewBinding ArrayAdapter&#xff0c;适配 AndroidX 和 API 21&#xff09;&#xff1a;✅ 一、绑定数据&#xff08;以…...

QPdf:Qt生态下的PDF渲染技术深度解析与现代应用实践

QPdf&#xff1a;Qt生态下的PDF渲染技术深度解析与现代应用实践 【免费下载链接】qpdf PDF viewer widget for Qt 项目地址: https://gitcode.com/gh_mirrors/qpd/qpdf 在Qt应用开发中&#xff0c;PDF文档处理一直是个技术痛点。传统方案要么依赖平台原生组件导致跨平台…...

如何彻底解决Android Studio中文界面兼容性问题:专业级终极配置指南

如何彻底解决Android Studio中文界面兼容性问题&#xff1a;专业级终极配置指南 【免费下载链接】AndroidStudioChineseLanguagePack AndroidStudio中文插件(官方修改版本&#xff09; 项目地址: https://gitcode.com/gh_mirrors/an/AndroidStudioChineseLanguagePack 还…...

7步构建AI绘画流水线:Krita-AI-Diffusion全能力解析

7步构建AI绘画流水线&#xff1a;Krita-AI-Diffusion全能力解析 【免费下载链接】krita-ai-diffusion Streamlined interface for generating images with AI in Krita. Inpaint and outpaint with optional text prompt, no tweaking required. 项目地址: https://gitcode.c…...

QCS6490实战解码:从参数到场景的性能跃迁指南

1. QCS6490硬件性能的实战价值解码 第一次拿到QCS6490开发板时&#xff0c;我对着参数表发呆了半小时——12TOPS算力、5路ISP、Wi-Fi 6E这些参数看起来很厉害&#xff0c;但到底能解决哪些实际问题&#xff1f;经过三个月的项目实战&#xff0c;我发现这款芯片的真正价值在于将…...