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

面试题-TS(六):TypeScript 中的泛型是什么?

面试题-TS(6):TypeScript 中的泛型是什么?

在TypeScript中,泛型(Generics)是一种强大的特性,它允许我们在编写可重用的代码时增加灵活性。泛型使得我们可以编写不特定数据类型的代码,从而提高代码复用性和可读性。

一、什么是泛型?

泛型是一种类型参数化的方式,它允许我们在函数、类、接口等代码中定义一个或多个类型参数,而这些参数在使用时并不指定具体的数据类型。在调用函数或实例化类时,我们可以通过传递不同的数据类型来使用相同的泛型代码。

TypeScript中的泛型使用尖括号(<>)来表示,并可以使用任意标识符来表示类型参数。以下是一个简单的泛型函数的示例:

function identity<T>(arg: T): T {return arg;
}

在上面的示例中,<T>表示类型参数,它允许我们在函数调用时传递不同的数据类型。例如:

let result1 = identity<number>(42);      // result1的类型为number
let result2 = identity<string>("hello"); // result2的类型为string

通过泛型,我们可以灵活地使用相同的代码处理不同的数据类型,提高代码的复用性。

二、泛型函数

泛型函数是一种可以处理多种数据类型的函数。我们可以在函数定义时使用泛型类型参数,并在函数体内使用这些参数来操作数据。

以下是一个简单的泛型函数示例,用于交换两个值:

function swap<T>(a: T, b: T): void {let temp: T = a;a = b;b = temp;
}

在上面的示例中,我们使用泛型类型参数<T>来表示任意类型的数据。通过泛型,我们可以在调用函数时传递不同类型的数据,从而实现对不同数据类型的交换操作。

let num1 = 10;
let num2 = 20;
swap<number>(num1, num2);let str1 = "hello";
let str2 = "world";
swap<string>(str1, str2);

泛型函数的优势在于可以用于处理不同类型的数据,从而提高代码的复用性和灵活性。

三、泛型类

除了泛型函数,我们还可以使用泛型类。泛型类是一种可以接受不同类型参数的类。在类定义时使用泛型类型参数,并在类的属性、方法等成员中使用这些参数来处理数据。

以下是一个简单的泛型类示例,用于存储和获取元素:

class Container<T> {private element: T;constructor(element: T) {this.element = element;}getElement(): T {return this.element;}
}

在上面的示例中,我们使用泛型类型参数<T>来表示任意类型的数据。通过泛型类,我们可以实例化不同类型的Container对象,并存储和获取不同类型的数据。

let numContainer = new Container<number>(42);
console.log(numContainer.getElement()); // 输出:42let strContainer = new Container<string>("hello");
console.log(strContainer.getElement()); // 输出:"hello"

泛型类的优势在于可以用于创建可以存储和处理不同类型数据的类,增加了代码的复用性和灵活性。

四、泛型接口

另外,我们还可以使用泛型接口。泛型接口是一种定义可以接受不同类型参数的接口。在接口定义时使用泛型类型参数,并在实现接口时指定具体的类型。

以下是一个简单的泛型接口示例,用于定义可以存储和获取元素的容器:

interface IContainer<T> {getElement(): T;setElement(element: T): void;
}

在上面的示例中,我们使用泛型类型参数<T>来表示任意类型的数据。通过泛型接口,我们可以实现具体的容器类,并在类中定义存储和获取元素的方法。

class NumberContainer implements IContainer<number> {private element: number;constructor(element: number) {this.element = element;}getElement(): number {return this.element;}setElement(element: number): void {this.element = element;}
}class StringContainer implements IContainer<string> {private element: string;constructor(element: string) {this.element = element;}getElement(): string {return this.element;}setElement(element: string): void {this.element = element;}
}

通过泛型接口,我们可以在实现接口时指定具体的类型参数,从而实现对不同类型数据的处理。

let numContainer: IContainer<number> = new NumberContainer(42);
console.log(numContainer.getElement()); // 输出:42let strContainer: IContainer<string> = new StringContainer("hello");
console.log(strContainer.getElement()); // 输出:"hello"

泛型接口的优势在于可以用于定义可以处理不同类型数据的接口,增加了代码的复用性和可读性。

五、泛型约束

在使用泛型时,有时候我们希望对泛型类型参数加以约束,以限制其允许的数据类型。这时我们可以使用泛型约束。

以下是一个简单的泛型约束示例,用于计算数字数组的和:

function sum<T extends number>(arr: T[]): number {let total: number = 0;for (let num of arr) {total += num;}return total;
}

在上面的示例中,我们使用extends number来对泛型类型参数<T>进行约束,表示T必须是number类型或其子类型。通过泛型约束,我们可以确保只有数字数组才能通过该函数进行求和。

let numbers = [1, 2, 3, 4, 5];
let result = sum(numbers); // 输出:15

泛型约束的优势在于可以对泛型类型参数进行限制,增加了代码的安全性和可维护性。

六、在编写可重用的代码时使用泛型的好处

使用泛型的主要好处在于提高代码的复用性和灵活性。通过泛型,我们可以编写不特定数据类型的代码,使得这些代码可以适用于不同的数据类型。这样一来,我们不需要为每种数据类型编写重复的代码,从而减少了代码冗余。

泛型还可以增加代码的可读性和可维护性。当我们在编写泛型代码时,我们可以将代码逻辑和数据类型分离开来,使得代码更加清晰和易于理解。同时,泛型还可以在编译时进行类型检查,提前捕获潜在的类型错误,减少了运行时错误的可能性。

另外,泛型还使得我们可以更好地封装代码,隐藏内部实现细节。这样可以提高代码的安全性,并使得代码更易于维护和升级。

相关文章:

面试题-TS(六):TypeScript 中的泛型是什么?

面试题-TS(6)&#xff1a;TypeScript 中的泛型是什么&#xff1f; 在TypeScript中&#xff0c;泛型&#xff08;Generics&#xff09;是一种强大的特性&#xff0c;它允许我们在编写可重用的代码时增加灵活性。泛型使得我们可以编写不特定数据类型的代码&#xff0c;从而提高代…...

QT DAY4

1.思维导图 2.手动完成服务器的实现&#xff0c;并具体程序要注释清楚 头文件 #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTcpServer> #include <QTcpSocket> #include <QMessageBox> #include <QList> #include <QD…...

最新Ai创作源码ChatGPT商用运营源码/支持GPT4.0+支持ai绘画+支持Mind思维导图生成

本系统使用Nestjs和Vue3框架技术&#xff0c;持续集成AI能力到本系统&#xff01; 支持GPT3模型、GPT4模型Midjourney专业绘画&#xff08;全自定义调参&#xff09;、Midjourney以图生图、Dall-E2绘画Mind思维导图生成应用工作台&#xff08;Prompt&#xff09;AI绘画广场自定…...

一个go的支持多语言的error自动生成插件

大家好&#xff0c;我是peachesTao&#xff0c;今天给大家推荐一个go的支持多语言的error自动生成的插件&#xff0c;插件主页可以访问下方链接。 在一个多语言国际化的项目中&#xff0c;后端接口返回给前端的错误描述也需要国际化&#xff0c;我们来看一下后端给前端返回多语…...

wireshark抓包新手使用教程(超详细)

一、简介 Wireshark是一款非常流行的网络封包分析软件&#xff0c;可以截取各种网络数据包&#xff0c;并显示数据包详细信息。 为了安全考虑&#xff0c;wireshark只能查看封包&#xff0c;而不能修改封包的内容&#xff0c;或者发送封包。 wireshark能获取HTTP&#xff0c;也…...

平均列顺序对列排斥能的影响

( A, B )---3*30*2---( 1, 0 )( 0, 1 ) 让网络的输入只有3个节点&#xff0c;AB训练集各由5张二值化的图片组成&#xff0c;让A有6个1&#xff0c;B有4个1&#xff0c;并且让这10个1的位置没有重合。比较迭代次数的顺序。 其中有9组数据 差值结构 A-B 迭代次数 构造平均列 …...

微信小程序-处理ios无法播放语音的问题

背景 框架&#xff1a;tarovue3 问题&#xff1a;今天搞小程序语音播放功能&#xff0c;开放工具播放正常&#xff0c;但是到ios手机上调试时无法播放&#xff0c;在网上找到个好办法 解决方案 核心代码 Taro.setInnerAudioOption({obeyMuteSwitch: false // 解决有一些IOS无…...

区块链 2.0笔记

区块链 2.0 以太坊概述 相对于比特币的几点改进 缩短出块时间至10多秒ghost共识机制mining puzzle BTC:计算密集型ETH&#xff1a;memory-hard(限制ASIC) proof of work->proof of stake对智能合约的支持 BTC&#xff1a;decentralized currencyETH&#xff1a;decentral…...

深入理解Vue响应式系统:数据绑定探索

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…...

web流程自动化详解

今天给大家带来Selenium的相关解释操作 一、Selenium Selenium是一个用于自动化Web浏览器操作的开源工具和框架。它提供了一组API&#xff08;应用程序接口&#xff09;&#xff0c;可以让开发人员使用多种编程语言&#xff08;如Java、Python、C#等&#xff09;编写测试脚本&…...

什么是框架?为什么要学框架?

一、什么是框架 框架是整个或部分应用的可重用设计&#xff0c;是可定制化的应用骨架。它可以帮开发人员简化开发过程&#xff0c;提高开发效率。 项目里有一部分代码&#xff1a;和业务无关&#xff0c;而又不得不写的代码>框架 项目里剩下的部分代码&#xff1a;实现业务…...

什么是 Sass?

Sass 介绍 什么是 Sass&#xff1f; 官方标语 世界上最成熟、最稳定、最强大的专业级 CSS 扩展语言。怎么理解这句话呢&#xff1f;我们平时写的 CSS 代码可以理解为静态样式语言&#xff0c;而 Scss 就是动态样式语言&#xff0c;何为动态&#xff1f;就是让你写 CSS 跟写 …...

Kotlin~Memento备忘录模式

概念 备忘录模式是一种行为型设计模式&#xff0c;用于捕获和存储对象的内部状态&#xff0c;并在需要时将对象恢复到之前的状态。 备忘录模式允许在不暴露对象内部实现细节的情况下&#xff0c;对对象进行状态的保存和恢复。 角色介绍 Originator&#xff1a;原发器&#x…...

单链表的多语言表达:C++、Java、Python、Go、Rust

单链表 是一种链式数据结构&#xff0c;由一个头节点和一些指向下一个节点的指针组成。每个节点包含一个数据元素和指向下一个节点的指针。头节点没有数据&#xff0c;只用于表示链表的开始位置。 单链表的主要操作包括&#xff1a; 添加元素&#xff1a;在链表的头部添加新…...

微信小程序 background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法

项目场景 微信小程序&#xff0c;设置background-image直接设置本地图片路径。 问题描述 编辑器正常显示&#xff0c;真机运行不显示 原因分析 background-image只能用网络url或者base64图片编码。 解决方案 1、将本地图片转为网络url后设置到background-image上 例如&…...

SQLite Studio 连接 SQLite数据库

1、在SQLite中创建数据库和表 1.1、按WINR&#xff0c;打开控制台&#xff0c;然后把指引到我们的SQLite的安装路径&#xff0c;输入D:&#xff0c;切换到D盘&#xff0c;cd 地址&#xff0c;切换到具体文件夹&#xff0c;输入“sqlite3”&#xff0c;启动服务 1.2、创建数据库…...

【业务功能篇58】Springboot + Spring Security 权限管理 【中篇】

4.2.3 认证 4.2.3.1 什么是认证&#xff08;Authentication&#xff09; 通俗地讲就是验证当前用户的身份&#xff0c;证明“你是你自己”&#xff08;比如&#xff1a;你每天上下班打卡&#xff0c;都需要通过指纹打卡&#xff0c;当你的指纹和系统里录入的指纹相匹配时&…...

Docker挂载目录失败问题解决

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…...

css中隐藏页面中某一个元素有什么方法?

我们可以使用css的z-index属性&#xff0c;将元素的-index去给它设置一个负值&#xff0c;使它隐藏在其他元素的后面。使用css样式进行隐藏我们可以使用display这个属性。&#xff08;1&#xff09;使用display:none完全进行隐藏元素&#xff0c;并且不占据空间也不会影响页面布…...

Unity 多语言问题C#篇

DateTime.ToString()不同语言环境问题 问题描述&#xff1a;PlayerPrefs.SetString("timeKey", DateTime.Now.ToString());切换系统语言后DateTime.Parse(PlayerPrefs.GetString("timeKey"));报错FormatException: String was not recognized as a valid D…...

PPTX转HTML终极指南:如何在浏览器中免费快速完成转换?

PPTX转HTML终极指南&#xff1a;如何在浏览器中免费快速完成转换&#xff1f; 【免费下载链接】PPTX2HTML Convert pptx file to HTML by using pure javascript 项目地址: https://gitcode.com/gh_mirrors/pp/PPTX2HTML 你是否经常需要将PowerPoint演示文稿转换为网页格…...

深度解析开源翻译方案:如何构建高效免费的DeepL替代品

深度解析开源翻译方案&#xff1a;如何构建高效免费的DeepL替代品 【免费下载链接】DeepLX Powerful Free DeepL API, No Token Required 项目地址: https://gitcode.com/gh_mirrors/de/DeepLX DeepL翻译API的免费限制和复杂配置常常让开发者望而却步。DeepLX作为开源免…...

边缘检测:Prewitt算子与Roberts算子的对比使用

边缘检测&#xff1a;Prewitt算子与Roberts算子的对比使用&#x1f4da; 本章学习目标&#xff1a;深入理解Prewitt算子与Roberts算子的对比使用的核心概念与实践方法&#xff0c;掌握关键技术要点&#xff0c;了解实际应用场景与最佳实践。本文属于《计算机视觉教程》特征提取…...

JMeter四层断言体系:从HTTP协议到业务语义的全链路校验

1. 为什么JMeter的断言不是“加个检查框”就完事了&#xff1f;很多人第一次在JMeter里点开“添加 → 断言 → 响应断言”&#xff0c;填上一个期望值&#xff0c;跑完线程组一看“绿色对勾”&#xff0c;就以为接口测试闭环完成了。我带过三届测试新人&#xff0c;90%都在这个…...

SMUDebugTool:免费开源的AMD Ryzen硬件调试利器,释放处理器全部潜力

SMUDebugTool&#xff1a;免费开源的AMD Ryzen硬件调试利器&#xff0c;释放处理器全部潜力 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table…...

超越准确率:基于数据集特性的归一化性能度量设计与实践

1. 项目概述与核心问题在机器学习项目里&#xff0c;评估模型性能是绕不开的一环。我们最熟悉的老朋友——准确率、精确率、F1分数——确实简单直观&#xff0c;拿来跟业务方汇报也容易讲清楚。但干得久了&#xff0c;尤其是在处理一些“非标准”数据集时&#xff0c;你总会隐隐…...

如何快速实现文档自动化下载:免费浏览器脚本终极指南

如何快速实现文档自动化下载&#xff1a;免费浏览器脚本终极指南 【免费下载链接】kill-doc 看到经常有小伙伴们需要下载一些免费文档&#xff0c;但是相关网站浏览体验不好各种广告&#xff0c;各种登录验证&#xff0c;需要很多步骤才能下载文档&#xff0c;该脚本就是为了解…...

猫抓浏览器扩展:如何高效捕获并下载网页媒体资源的终极指南

猫抓浏览器扩展&#xff1a;如何高效捕获并下载网页媒体资源的终极指南 【免费下载链接】cat-catch 猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension 项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch 在当今以流媒体为主导的互联…...

基于XAI与增量删除的地球观测数据特征精炼实战

1. 项目概述与核心思路在机器学习项目中&#xff0c;我们常常陷入一个思维定式&#xff1a;数据越多&#xff0c;模型性能就越好。尤其是在处理地球观测这类多模态、高维度的时序数据时&#xff0c;从哨兵卫星的光谱波段、气象站的小时级观测到静态地形数据&#xff0c;我们习惯…...

DLSS Swapper终极指南:免费开源的DLSS文件智能管理工具

DLSS Swapper终极指南&#xff1a;免费开源的DLSS文件智能管理工具 【免费下载链接】dlss-swapper 项目地址: https://gitcode.com/GitHub_Trending/dl/dlss-swapper 你是否曾经遇到过这样的困扰&#xff1a;你心爱的游戏明明支持DLSS技术&#xff0c;但游戏自带的DLSS…...