TypeScript泛型和类型体操

news2025/11/4 22:07:22

 🎬 岸边的风：个人主页

 🔥 个人专栏 :《 VUE 》 《 javaScript 》

⛺️ 生活的理想，就是为了理想的生活 !

在这里插入图片描述

目录

泛型（Generics）

1. 泛型函数

2. 泛型接口

3. 泛型类

类型体操（Type Gymnastics）

1. 条件类型（Conditional Types）

2. keyof 操作符和索引访问类型

3. infer 关键字

extends 关键字和类型约束

泛型函数Util

Partial

Required

Pick,>

Exclude,>

Omit,>

Readonly

总结

泛型和类型体操（Type Gymnastics）是 TypeScript 中高级类型系统的重要组成部分。它们提供了强大的工具和技巧，用于处理复杂的类型操作和转换。

泛型（Generics）

1. 泛型函数

泛型函数允许我们在函数定义中使用类型参数，以便在函数调用时动态指定类型。例如：

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

let result = identity<number>(42);  // result 的类型为 number

在上面的示例中，identity 函数使用类型参数 T，并返回与输入类型相同的值。通过显式传递泛型参数，我们可以确保在函数调用时指定了具体的类型。

2. 泛型接口

泛型接口允许我们在接口定义中使用类型参数，以便在实现该接口时指定具体的类型。例如：

interface Container<T> {
  value: T;
}

let container: Container<number> = { value: 42 };

在上面的示例中，我们定义了一个泛型接口 Container，它包含一个类型参数 T。通过指定 Container<number>，我们创建了一个具体的实现，其中的 value 属性类型为 number。

3. 泛型类

泛型类允许我们在类定义中使用类型参数，以便在创建类的实例时指定具体的类型。例如：

class Stack<T> {
  private items: T[] = [];

  push(item: T) {
    this.items.push(item);
  }

  pop(): T | undefined {
    return this.items.pop();
  }
}

let stack = new Stack<number>();
stack.push(1);
stack.push(2);
let item = stack.pop();  // item 的类型为 number | undefined

在上面的示例中，我们定义了一个泛型类 Stack，它使用类型参数 T 来表示堆栈中的元素类型。通过创建 Stack<number> 的实例，我们限制了堆栈中的元素必须为 number 类型。

类型体操（Type Gymnastics）

1. 条件类型（Conditional Types）

条件类型允许我们根据输入类型的条件判断结果来选择不同的类型。条件类型的语法形式为：

T extends U ? X : Y

其中，T 是待检查的类型，U 是条件类型，X 是满足条件时返回的类型，Y 是不满足条件时返回的类型。

下面是一个使用条件类型的示例：

type Check<T> = T extends string ? true : false;

type Result = Check<string>;  // Result 的类型为 true

在上面的示例中，我们定义了一个条件

类型 Check<T>，它接受一个类型参数 T。如果 T 是 string 类型，那么 Check<T> 的类型将是 true，否则为 false。

2. keyof 操作符和索引访问类型

keyof 操作符用于获取类型的所有属性名，结合索引访问类型可以从一个类型中获取属性的具体类型。

interface Person {
  name: string;
  age: number;
}

type PersonKeys = keyof Person;  // "name" | "age"
type PersonNameType = Person['name'];  // string

在上面的示例中，我们使用 keyof 操作符获取了 Person 接口的属性名集合，并通过索引访问类型获取了 Person 接口中 name 属性的类型。

3. infer 关键字

infer 关键字用于在条件类型中推断类型，并将其赋值给一个类型变量。

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;

function add(a: number, b: number): number {
  return a + b;
}

type AddReturnValue = ReturnType<typeof add>;  // 类型为 number

在上面的示例中，ReturnType 类型接受一个类型参数 T，并使用条件类型和 infer 关键字推断函数类型的返回类型。通过调用 ReturnType<typeof add>，我们推断出 add 函数的返回类型为 number。

当涉及到泛型时，还有一些重要的概念和内置泛型函数可以深入分析。让我们继续探讨 extends 关键字、TS 官方内置的一些泛型函数以及它们的使用。

extends 关键字和类型约束

在泛型中，我们可以使用 extends 关键字来对泛型类型进行约束。这样可以确保传递给泛型的类型满足特定条件。

function printProperty<T extends { name: string }>(obj: T): void {
  console.log(obj.name);
}

printProperty({ name: 'John', age: 25 });  // 输出 'John'

在上面的示例中，printProperty 函数接受一个泛型参数 T，该参数必须满足一个约束条件：具有 name 属性，且 name 的类型为 string。通过使用 extends 关键字和类型约束，我们可以确保 obj 参数具有所需的属性和类型，从而避免出现错误。

泛型函数Util

TypeScript 提供了一些内置的泛型函数，这些函数被广泛用于处理各种类型操作。

Partial<T>

Partial<T> 是 TypeScript 中的一个内置泛型类型，它可以将给定类型 T 中的所有属性转换为可选属性。这对于创建部分完整的对象非常有用。

interface Person {
  name: string;
  age: number;
}

type PartialPerson = Partial<Person>;

const partialPerson: PartialPerson = { name: 'John' };  // age 属性是可选的

在上面的示例中，Partial<Person> 将 Person 接口中的所有属性变为可选属性，从而创建了一个部分完整的 PartialPerson 类型。

Required<T>

Required<T> 是 TypeScript 中的另一个内置泛型类型，它可以将给定类型 T 中的所有可选属性转换为必需属性。这对于确保对象的完整性非常有用。

interface Person {
  name?: string;
  age?: number;
}

type RequiredPerson = Required<Person>;

const requiredPerson: RequiredPerson = { name: 'John', age: 25 };  // name 和 age 属性是必需的

在上面的示例中，Required<Person> 将 Person 接口中的所有可选属性变为必需属性，从而创建了一个要求完整性的 RequiredPerson 类型。

Pick<T, K>

Pick<T, K> 是 TypeScript 中的另一个内置泛型函数，它可以从给定类型 T 中选择指定的属性 K 组成一个新的类型。

interface Person {
  name: string;
  age: number;
  address: string;
}

type NameAndAge = Pick<Person, 'name' | 'age'>;

const person: NameAndAge = { name:

 'John', age: 25 };  // 只包含 name 和 age 属性

在上面的示例中，Pick<Person, 'name' | 'age'> 从 Person 接口中选择了 'name' 和 'age' 属性，创建了一个新的类型 NameAndAge。

我们还可以结合泛型和内置泛型函数来实现更复杂的类型操作。以下是一个示例，展示了如何使用 Pick 和泛型来创建一个函数，该函数从给定对象中选择指定属性，并返回一个新的对象。

function pickProperties<T, K extends keyof T>(obj: T, keys: K[]): Pick<T, K> {
  const result: Partial<T> = {};
  for (const key of keys) {
    result[key] = obj[key];
  }
  return result as Pick<T, K>;
}

interface Person {
  name: string;
  age: number;
  address: string;
}

const person: Person = {
  name: 'John',
  age: 25,
  address: '123 Main St'
};

const nameAndAge = pickProperties(person, ['name', 'age']);  // 只包含 name 和 age 属性
console.log(nameAndAge);  // 输出: { name: 'John', age: 25 }

在上面的示例中，pickProperties 函数接受一个泛型参数 T 和一个属性数组 keys。通过使用 Pick<T, K>，我们将从给定对象 obj 中选择指定的属性 keys，并创建一个新的对象。

这个例子结合了泛型、内置泛型函数 Pick、keyof 操作符和 extends 关键字，展示了如何在 TypeScript 中处理复杂的类型操作和转换。

当涉及到官方内置的泛型函数时，还有一些重要的函数值得分析。让我们继续探讨一些常用的官方内置泛型函数以及它们的使用。

Exclude<T, U>

Exclude<T, U> 是 TypeScript 中的一个内置泛型函数，用于从类型 T 中排除类型 U。它返回一个新类型，该新类型包含在 T 中存在但不在 U 中存在的成员类型。

type T = Exclude<"a" | "b" | "c", "a" | "b">;  // T 的类型为 "c"

在上面的示例中，Exclude<"a" | "b" | "c", "a" | "b"> 排除了类型 "a" 和 "b"，返回类型为 "c"。

Omit<T, K>

Omit<T, K> 是 TypeScript 中的另一个内置泛型函数，它返回一个新类型，该新类型排除了类型 T 中指定的属性 K。

interface Person {
  name: string;
  age: number;
  address: string;
}

type PersonWithoutAddress = Omit<Person, "address">;

在上面的示例中，Omit<Person, "address"> 返回了一个新类型 PersonWithoutAddress，该类型排除了 Person 接口中的 address 属性。

Readonly<T>

Readonly<T> 是 TypeScript 中的另一个内置泛型函数，它将类型 T 中的所有属性转换为只读属性。

interface Person {
  name: string;
  age: number;
}

type ReadonlyPerson = Readonly<Person>;

在上面的示例中，Readonly<Person> 将 Person 接口中的所有属性变为只读属性，创建了一个新类型 ReadonlyPerson。

总结

泛型和类型体操是 TypeScript 中强大的类型系统的关键组成部分。通过使用泛型，我们可以创建可重用、灵活和类型安全的代码。内置泛型函数提供了一些常用的类型转换工具，如 Partial、Required 和 Pick，可以帮助我们更方便地处理类型操作。

通过结合泛型、extends 关键字、内置泛型函数和其他高级类型概念，我们能够在 TypeScript 中编写更复杂、类型安全的代码，并利用 TypeScript 的强大类型系统来提高代码的可读性、可维护性和可扩展性。

 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1008455.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

leetcode 232 用栈实现队列

leetcode 232 用栈实现队列

请你仅使用两个栈实现先入先出队列。队列应当支持一般队列支持的所有操作&#xff08;push、pop、peek、empty&#xff09;&#xff1a; 实现 MyQueue 类&#xff1a; void push(int x) 将元素 x 推到队列的末尾int pop() 从队列的开头移除并返回元素int peek() 返回队列开头…
阅读更多...
Python实现天文计算

Python实现天文计算

迷途小书童 读完需要 2分钟 速读仅需 1 分钟 1 简介 ephem 模块为 Python 提供了精确的天文计算能力&#xff0c;可以预测星球、卫星的轨道信息&#xff0c;计算日出日落、经星时间等数据&#xff0c;它的算法准确可靠。最初由 Brandon Craig Rhodes 在 20 世纪 90 年代开发&am…
阅读更多...
数字IC验证23912--寄存器模型

数字IC验证23912--寄存器模型

文章目录 寄存器模型的集成总线UVC的实现总线UVC的示例Adapter的实现Adapter的集成 访问方式前门访问后门访问 寄存器模型的集成 总线UVC的实现 MCDF访问寄存器的总线接口时序较为简单。控制寄存器接口首先需要在每一个时钟解析cmd。当cmd为写指令时&#xff0c;即需要把数据c…
阅读更多...
Linux安装mysql8.0.34（图文详细教程2023）

Linux安装mysql8.0.34（图文详细教程2023）

安装mysql数据库目录2023-09-13更新 1. 下载mysql数据库2. 安装3. mysql启动4. 进入数据库修改密码 以下是root用户操作&#xff0c; 非root用户&#xff0c;命令前请添加sudo 1. 下载mysql数据库 下载地址&#xff1a; https://dev.mysql.com/downloads/mysql/ 获取下载链接&…
阅读更多...
OPENCV进行图像修复

OPENCV进行图像修复

API # -*- coding:utf-8 -*- """ 作者：794919561 日期：2023/9/14 """ import cv2 import numpy as npimg = cv2.imread("F:\\learnOpenCV\\openCVLearning\\pictures\\Lena.jpg") mask = cv2.imread
阅读更多...
移动测试之语音识别功能如何测试？

移动测试之语音识别功能如何测试？

移动测试之语音识别功能如何测试&#xff1f; 要知道语音识别功能如何测试&#xff0c;我们先了解智能产品语音交互流程&#xff1a; 所以&#xff0c;要进行测试的话&#xff0c;我们需要从以下几个维度来准备测试点&#xff1a; 基础功能测试&#xff1a; 1、声纹的录入&…
阅读更多...
不定积分的概念和性质

不定积分的概念和性质

目录 原函数 不定积分 不定积分的几何意义 原函数的存在定理 不定积分的性质 不定积分是微积分的一个关键部分&#xff0c;它涉及到一个函数的不定积分的计算。不定积分可以理解为求一个函数的原函数&#xff0c;也被称为反导数。原函数是一个函数&#xff0c;使得该函数的…
阅读更多...
MongoDB-1入门介绍

MongoDB-1入门介绍

NoSQL NoSQL(NoSQL Not Only SQL)&#xff0c;意即反SQL运动&#xff0c;指的是非关系型的数据库 优点 1、对数据库高并发读写。 2、对海量数据的高效率存储和访问。 3、对数据库的高可扩展性和高可用性。 弱点&#xff1a; 1、数据库事务一致性需求 2、数据库的写实时性…
阅读更多...
多模态图像合成与编辑

多模态图像合成与编辑

由于信息在现实世界中以多种形式存在&#xff0c;多模态信息之间的有效交互和融合对于计算机视觉和深度学习研究中多模态数据的创建和感知起着关键作用。多模态图像合成与编辑由于具有强大的多模态信息交互建模能力&#xff0c;成为近年来的研究热点。多模态引导不是为网络训练…
阅读更多...
点云从入门到精通技术详解100篇-从全局到局部的三维点云细节差异分析

点云从入门到精通技术详解100篇-从全局到局部的三维点云细节差异分析

目录 前言 国内外研究现状 细节差异分析相关研究 三维点云的相似性相关研究 存在的问题 三维点云对比的相关技术 2.1 三维点云的采集设备 2.2三维点云的存储格式 2.3三维点云的空间变换 2.4三维点云相似度分析 2.4.1点云特征的提取 2.4.2特征相似度计算 本文篇幅较长&#xff0…
阅读更多...
解决java.util.NoSuchElementException

解决java.util.NoSuchElementException

解决java.util.NoSuchElementException 解决java.util.NoSuchElementException摘要引言正文1. 了解异常的根本原因2. 避免不正确的索引3. 处理空集合4. 使用迭代器时要小心5. 异常处理 总结参考资料 博主 默语带您 Go to New World. ✍ 个人主页—— 默语 的博客&#x1f466;&…
阅读更多...
博客-三更草堂

博客-三更草堂

博客-三更草堂 后台分类页面修改&#xff0c;添加状态修改接口 ① …前端工程\sg-vue-admin\src\api\content\category.js 文件中添加新接口 // 修改分类状态 export function changeCategoryStatus(id, status) {const data {id,status}return request({url: /content/cat…
阅读更多...
【编程实践】使用pcl提取给定点云的三维边界点

【编程实践】使用pcl提取给定点云的三维边界点

1 执行结果 原始点云可视化 搜索半径设置为0.1m 搜索半径设置为0.05m 2 代码实现 // boundary#include <pcl/point_types.h> #include <pcl/features/normal_3d.h> #include <pcl/features/boundary.h> #include <pcl/io/file_io.h> #include &l…
阅读更多...
面对 HR 的空窗期提问，你会如何回答？

面对 HR 的空窗期提问，你会如何回答？

原文链接 面对 HR 的空窗期提问&#xff0c;你会如何回答&#xff1f; 你是否有过这样的经历&#xff0c;在一段时间内&#xff0c;你离开了工作岗位&#xff0c;或者在寻找新的工作机会&#xff0c;这段时间我们称之为“空窗期”。 对于这段时间&#xff0c;我们该如何看待&…
阅读更多...
idea中的debug界面上没有进入方法的红色按钮

idea中的debug界面上没有进入方法的红色按钮

问题描述&#xff1a; 这里缺少进入系统方法的红色按钮。 问题解决方法&#xff1a; 在上面图片红框范围内右键点击进入。 点击号 搜索 ‘force’ 添加即可完成 上下拖动即可调整界面按钮顺序
阅读更多...
I2C总线协议

I2C总线协议

什么是I2C I2C&#xff08;Inter-Integrated Circuit&#xff09;&#xff0c;也可以叫IIC、I2C&#xff0c;译作集成电路总线&#xff0c;是两线式串行通信总线&#xff0c;用于设备间的通讯等&#xff0c;标准情况下最高传送速率达100Kbps。顾名思义&#xff0c;I2C通讯只需…
阅读更多...
如何用示波器测量放电波形

如何用示波器测量放电波形

示波器那么重要&#xff0c;你确定不进来看看&#xff1f;_哔哩哔哩_bilibili 5分钟搞明白示波器的 带宽 采样率 存储深度_哔哩哔哩_bilibili 年轻人的第一台示波器选手持还是台式&#xff1f;_哔哩哔哩_bilibili 以示波器为例&#xff0c;测量某设备波形。 1、开机&#xff…
阅读更多...
在Excel中使用SQL

在Excel中使用SQL

说明: Excel中许多函数虽然能代替SQL的功能&#xff0c;但是比起SQL&#xff0c;还是有一些逊色&#xff0c;特意做了这个教程&#xff0c;主要有: 分组统计&#xff0c;Excel中用数据透视表&#xff0c;SQL中用Group By去重&#xff0c;Excel中可以用条件标识功能(开始->条…
阅读更多...
Lyft 计划开源人工智能算法测试工具

Lyft 计划开源人工智能算法测试工具

共享租车公司 Lyft 投入大量时间和资源开发工具来测试机器学习算法&#xff0c;近日 Lyft 宣布将向公众开源这些工具。正式投入生产环境之前&#xff0c;一款机器学习算法的测试和更替非常耗费时间&#xff0c;Lyft 开发的测试工具&#xff0c;是属于一种模拟器&#xff0c;能够…
阅读更多...
LLM 03-大模型的有害性

LLM 03-大模型的有害性

LLM 03-大模型的有害性 3.1 引言1 在这次内容中&#xff0c;我们将开始探讨大型语言模型的有害性&#xff08;危害&#xff09;。在这门课程中&#xff0c;我们将涵盖几种这些危害: 性能差异社会偏见和刻板印象有害信息虚假信息 另外在之后的课程中会讲述其他更多层面的危害…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023