当前位置: 首页 > 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…...

深度学习和神经网络

人工神经网络分为两个阶段&#xff1a; 1 &#xff1a;接收来自其他n个神经元传递过来的信号&#xff0c;这些输入信号通过与相应的权重进行 加权求和传递给下个阶段。&#xff08;预激活阶段&#xff09; 2&#xff1a;把预激活的加权结果传递给激活函数 sum :加权 f:激活…...

在CSDN学Golang云原生(Kubernetes Volume)

一&#xff0c;Volume 与 configMap Kubernetes 中的 Volume 和 ConfigMap 都是 Kubernetes 中常用的资源对象。它们可以为容器提供持久化存储和配置文件等。 Volume 可以将容器内部的文件系统挂载到宿主机上&#xff0c;也可以将多个容器间共享一个 Volume&#xff0c;并且 …...

第十五章 友元 异常和其他

RTTI RTTI是什么 RTTI是运行阶段类型识别&#xff0c;通过运行时类型识别&#xff0c;程序能够使用基类的指针或者引用来检查这些指针或者引用所指向的对象的实际派生类型。 RTTI的三个元素 dynamic_cast运算符 dynamic_cast概念&#xff1a; dynamic_cast运算符能够将基…...

制作DBC文件

​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ DBC文件是CAN通讯的密码本&#xff0c;Matlab的SimuLink中常用DBC作为CAN通讯的解析桥梁 制作DBC文件&#xff0c;内容是转速、位置&…...

【1.1】Java微服务:初识微服务

✅作者简介&#xff1a;大家好&#xff0c;我是 Meteors., 向往着更加简洁高效的代码写法与编程方式&#xff0c;持续分享Java技术内容。 &#x1f34e;个人主页&#xff1a;Meteors.的博客 &#x1f49e;当前专栏&#xff1a; 微服务 ✨特色专栏&#xff1a; 知识分享 &#x…...

数据结构--串、数组、广义表

这里写目录标题 串定义案例引用串的类型定义以及存储结构抽象类型定义存储结构(顺序表较为常用)顺序存储结构链式存储结构 串的模式匹配算法&#xff08;查找主串中是否有某个字串&#xff09;BF算法KMP算法设计思想对字串的回溯进行了优化代码对next【j】进行优化 数组类型一维…...

白银挑战——链表高频面试算法题

算法通关村第一关–链表白银挑战笔记 开始时间&#xff1a;2023年7月18日14:39:36 链表 Java中定义一个链表 class ListNode {public int val;public ListNode next;ListNode(int x) {val x;next null;}}1、四种方法解决两个链表第一个公共子节点 解释一下什么是公共节点 如…...

海外腾讯云账号:腾讯云高性能计算平台 THPC

高性能计算平台&#xff08;TencentCloud High Performance Computing&#xff0c;THPC&#xff09;是一款腾讯云自研的高性能计算资源管理服务&#xff0c;集成腾讯云上的计算、存储、网络等产品资源&#xff0c;并整合 HPC 专用作业管理调度、集群管理等软件&#xff0c;向用…...

eclipse 最新版没有navigator视图如何解决

使用project exploere视图可以显示类似navigator视图 1.显示project exploere视图 window---->show view --->project exploere 2.project exploere视图转换为类似navigator视图 第一步&#xff1a;点击视图右上角三个点或者倒三角&#xff0c;点击fiters and custom…...

Zynq-Linux移植学习笔记之62- PL挂载复旦微flash

1、背景介绍 现在为了全国产化需要&#xff0c;之前所有的进口flash全部要换成国产flash 2、复旦微flash型号 其中EFM25QU256和EFM25QL256对标winbond的w25q256 nor flash 3、FPGA设置 复旦微flash只支持单线模式&#xff0c;当使用PL侧的IP核访问时&#xff0c;需要设置模式…...

做外贸做独立网站划算吗/网络推广公司简介

包地址&#xff1a;go get -u github.com/spf13/cobra/cobra go mod init blog go get -u github.com/spf13/cobra/cobra具体写一个例子, 设计一个命令叫 blog&#xff0c; 有四个子命令 blog new [post-name] &#xff1a;创建一篇新的blog blog list &#xff1a;列出当前…...

网站建设 金手指 排名22/有域名了怎么建立网站

电脑开机显示hardware monitor 开机故障&#xff0c;主要显示一些电脑主板温度、CPU温度、CPU电压、内存电压……等&#xff0c;出现这种开机提示hardware monitor 开机故障解主要有以下几种原因&#xff0c;就带着大家来处理这些电脑开机故障。hardware monitor 开机故障解决方…...

个人备案购物网站/网络推广内容

目录一、简介1.1 Spring-Cloud Euraka介绍1.2 Euraka介绍二、部署Eureka Server2.1 创建项目2.2 配置文件2.3 启动类2.4 测试三、部署Eureka Client3.1 部署Service Provider3.1.1 创建项目3.1.2 配置文件3.1.3 启动类3.1.4 请求接口3.1.5 测试3.2 部署Servcie Customer3.2.1 创…...

投票网站制作免费/seo课程培训学校

Rdt2.1和2.2Rdt2.0有什么缺陷&#xff1f; 如果ACK/NAK消息发生了错误/被破坏&#xff08;corrupt&#xff09;怎么办&#xff1f; 1为ACK/NAK加checksum&#xff0c;检验并纠错 2发送方收到被破坏的ACKACK消息发生了错误/被破坏&#xff08;corrupt&#xff09;怎么办&#x…...

做航模的网站/推广普通话标语

首先呢&#xff0c;后面你提到的概念并不是python的高级用法&#xff0c;而是绝大多数语言都会有的&#xff0c;而且他们谈不上高级&#xff0c;只是面对特定场合产生出来的解决方案下&#xff0c;比较好的数据结构可以更好的支撑方案。 这也就是为什么有人会说&#xff0c;当你…...

爱漫画-只做精品的韩漫网站/免费网站模板

导语大家好&#xff0c;我是智能仓储物流技术研习社的社长&#xff0c;你的老朋友&#xff0c;老K。知识星球 * 原创电子书 * 深海社区 * 微信群 更多PPT文件请球友自己到知识星球领取。、知名企业-智能仓储物流技术研习社-建立智能物流系统甲方、集成商与周边配套商共同技术语…...