面试题-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):TypeScript 中的泛型是什么? 在TypeScript中,泛型(Generics)是一种强大的特性,它允许我们在编写可重用的代码时增加灵活性。泛型使得我们可以编写不特定数据类型的代码,从而提高代…...
QT DAY4
1.思维导图 2.手动完成服务器的实现,并具体程序要注释清楚 头文件 #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框架技术,持续集成AI能力到本系统! 支持GPT3模型、GPT4模型Midjourney专业绘画(全自定义调参)、Midjourney以图生图、Dall-E2绘画Mind思维导图生成应用工作台(Prompt)AI绘画广场自定…...
一个go的支持多语言的error自动生成插件
大家好,我是peachesTao,今天给大家推荐一个go的支持多语言的error自动生成的插件,插件主页可以访问下方链接。 在一个多语言国际化的项目中,后端接口返回给前端的错误描述也需要国际化,我们来看一下后端给前端返回多语…...
wireshark抓包新手使用教程(超详细)
一、简介 Wireshark是一款非常流行的网络封包分析软件,可以截取各种网络数据包,并显示数据包详细信息。 为了安全考虑,wireshark只能查看封包,而不能修改封包的内容,或者发送封包。 wireshark能获取HTTP,也…...
平均列顺序对列排斥能的影响
( A, B )---3*30*2---( 1, 0 )( 0, 1 ) 让网络的输入只有3个节点,AB训练集各由5张二值化的图片组成,让A有6个1,B有4个1,并且让这10个1的位置没有重合。比较迭代次数的顺序。 其中有9组数据 差值结构 A-B 迭代次数 构造平均列 …...
微信小程序-处理ios无法播放语音的问题
背景 框架:tarovue3 问题:今天搞小程序语音播放功能,开放工具播放正常,但是到ios手机上调试时无法播放,在网上找到个好办法 解决方案 核心代码 Taro.setInnerAudioOption({obeyMuteSwitch: false // 解决有一些IOS无…...
区块链 2.0笔记
区块链 2.0 以太坊概述 相对于比特币的几点改进 缩短出块时间至10多秒ghost共识机制mining puzzle BTC:计算密集型ETH:memory-hard(限制ASIC) proof of work->proof of stake对智能合约的支持 BTC:decentralized currencyETH:decentral…...
深入理解Vue响应式系统:数据绑定探索
🌷🍁 博主猫头虎 带您 Go to New World.✨🍁 🦄 博客首页——猫头虎的博客🎐 🐳《面试题大全专栏》 文章图文并茂🦕生动形象🦖简单易学!欢迎大家来踩踩~🌺 &a…...
web流程自动化详解
今天给大家带来Selenium的相关解释操作 一、Selenium Selenium是一个用于自动化Web浏览器操作的开源工具和框架。它提供了一组API(应用程序接口),可以让开发人员使用多种编程语言(如Java、Python、C#等)编写测试脚本&…...
什么是框架?为什么要学框架?
一、什么是框架 框架是整个或部分应用的可重用设计,是可定制化的应用骨架。它可以帮开发人员简化开发过程,提高开发效率。 项目里有一部分代码:和业务无关,而又不得不写的代码>框架 项目里剩下的部分代码:实现业务…...
什么是 Sass?
Sass 介绍 什么是 Sass? 官方标语 世界上最成熟、最稳定、最强大的专业级 CSS 扩展语言。怎么理解这句话呢?我们平时写的 CSS 代码可以理解为静态样式语言,而 Scss 就是动态样式语言,何为动态?就是让你写 CSS 跟写 …...
Kotlin~Memento备忘录模式
概念 备忘录模式是一种行为型设计模式,用于捕获和存储对象的内部状态,并在需要时将对象恢复到之前的状态。 备忘录模式允许在不暴露对象内部实现细节的情况下,对对象进行状态的保存和恢复。 角色介绍 Originator:原发器&#x…...
单链表的多语言表达:C++、Java、Python、Go、Rust
单链表 是一种链式数据结构,由一个头节点和一些指向下一个节点的指针组成。每个节点包含一个数据元素和指向下一个节点的指针。头节点没有数据,只用于表示链表的开始位置。 单链表的主要操作包括: 添加元素:在链表的头部添加新…...
微信小程序 background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法
项目场景 微信小程序,设置background-image直接设置本地图片路径。 问题描述 编辑器正常显示,真机运行不显示 原因分析 background-image只能用网络url或者base64图片编码。 解决方案 1、将本地图片转为网络url后设置到background-image上 例如&…...
SQLite Studio 连接 SQLite数据库
1、在SQLite中创建数据库和表 1.1、按WINR,打开控制台,然后把指引到我们的SQLite的安装路径,输入D:,切换到D盘,cd 地址,切换到具体文件夹,输入“sqlite3”,启动服务 1.2、创建数据库…...
【业务功能篇58】Springboot + Spring Security 权限管理 【中篇】
4.2.3 认证 4.2.3.1 什么是认证(Authentication) 通俗地讲就是验证当前用户的身份,证明“你是你自己”(比如:你每天上下班打卡,都需要通过指纹打卡,当你的指纹和系统里录入的指纹相匹配时&…...
Docker挂载目录失败问题解决
天行健,君子以自强不息;地势坤,君子以厚德载物。 每个人都有惰性,但不断学习是好好生活的根本,共勉! 文章均为学习整理笔记,分享记录为主,如有错误请指正,共同学习进步。…...
css中隐藏页面中某一个元素有什么方法?
我们可以使用css的z-index属性,将元素的-index去给它设置一个负值,使它隐藏在其他元素的后面。使用css样式进行隐藏我们可以使用display这个属性。(1)使用display:none完全进行隐藏元素,并且不占据空间也不会影响页面布…...
Unity 多语言问题C#篇
DateTime.ToString()不同语言环境问题 问题描述:PlayerPrefs.SetString("timeKey", DateTime.Now.ToString());切换系统语言后DateTime.Parse(PlayerPrefs.GetString("timeKey"));报错FormatException: String was not recognized as a valid D…...
测试微信模版消息推送
进入“开发接口管理”--“公众平台测试账号”,无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息: 关注测试号:扫二维码关注测试号。 发送模版消息: import requests da…...
智慧医疗能源事业线深度画像分析(上)
引言 医疗行业作为现代社会的关键基础设施,其能源消耗与环境影响正日益受到关注。随着全球"双碳"目标的推进和可持续发展理念的深入,智慧医疗能源事业线应运而生,致力于通过创新技术与管理方案,重构医疗领域的能源使用模式。这一事业线融合了能源管理、可持续发…...
Zustand 状态管理库:极简而强大的解决方案
Zustand 是一个轻量级、快速和可扩展的状态管理库,特别适合 React 应用。它以简洁的 API 和高效的性能解决了 Redux 等状态管理方案中的繁琐问题。 核心优势对比 基本使用指南 1. 创建 Store // store.js import create from zustandconst useStore create((set)…...
Unity3D中Gfx.WaitForPresent优化方案
前言 在Unity中,Gfx.WaitForPresent占用CPU过高通常表示主线程在等待GPU完成渲染(即CPU被阻塞),这表明存在GPU瓶颈或垂直同步/帧率设置问题。以下是系统的优化方案: 对惹,这里有一个游戏开发交流小组&…...
如何在看板中体现优先级变化
在看板中有效体现优先级变化的关键措施包括:采用颜色或标签标识优先级、设置任务排序规则、使用独立的优先级列或泳道、结合自动化规则同步优先级变化、建立定期的优先级审查流程。其中,设置任务排序规则尤其重要,因为它让看板视觉上直观地体…...
如何将联系人从 iPhone 转移到 Android
从 iPhone 换到 Android 手机时,你可能需要保留重要的数据,例如通讯录。好在,将通讯录从 iPhone 转移到 Android 手机非常简单,你可以从本文中学习 6 种可靠的方法,确保随时保持连接,不错过任何信息。 第 1…...
Device Mapper 机制
Device Mapper 机制详解 Device Mapper(简称 DM)是 Linux 内核中的一套通用块设备映射框架,为 LVM、加密磁盘、RAID 等提供底层支持。本文将详细介绍 Device Mapper 的原理、实现、内核配置、常用工具、操作测试流程,并配以详细的…...
Linux 内存管理实战精讲:核心原理与面试常考点全解析
Linux 内存管理实战精讲:核心原理与面试常考点全解析 Linux 内核内存管理是系统设计中最复杂但也最核心的模块之一。它不仅支撑着虚拟内存机制、物理内存分配、进程隔离与资源复用,还直接决定系统运行的性能与稳定性。无论你是嵌入式开发者、内核调试工…...
GruntJS-前端自动化任务运行器从入门到实战
Grunt 完全指南:从入门到实战 一、Grunt 是什么? Grunt是一个基于 Node.js 的前端自动化任务运行器,主要用于自动化执行项目开发中重复性高的任务,例如文件压缩、代码编译、语法检查、单元测试、文件合并等。通过配置简洁的任务…...
android RelativeLayout布局
<?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"match_parent"android:gravity&…...
