TypeScript-内置应用程序类型-Recode

文章目录

  • 前言
    • `Record<string, any>`
      • Record 的语法
      • 使用示例
      • 在你的代码中的应用
      • 示例代码


前言

学习TypeScript 内置应用程序类型


在 TypeScript 中,Record 是一个实用类型,它允许你基于一个键的联合类型和一个值的类型,来创建一个新的对象类型。Record<K, T> 接受两个类型参数:第一个参数 K 是键的联合类型,第二个参数 T 是所有键对应的值的类型。

Record<K, T> 的基本语法如下:

Record<KeysUnion, ValueType>

其中 KeysUnion 是一系列可能的键名的联合类型,ValueType 是这些键所对应的值的类型。

例如,假设你有一个键的联合类型 Keys 和一个值的类型 Value,你可以使用 Record 创建一个类型,该类型表示一个对象,其键是 Keys 中的一个,值是 Value 类型:

type Keys = 'name' | 'age' | 'gender';
type Value = string | number;type MyRecordType = Record<Keys, Value>;const example: MyRecordType = {name: 'John Doe',age: 30,gender: 'male'
};

在这个例子中,MyRecordType 将是一个具有 nameagegender 属性的对象类型,这些属性的值可以是字符串或数字。

Record 类型常用于以下场景:

  1. 将一组键映射到相同的值类型:这在创建配置对象或枚举类似对象时特别有用。
  2. 类型安全的属性访问:当你在对象上访问属性时,TypeScript 会确保你访问的属性是类型定义中存在的。
  3. 创建泛型工厂函数或类:可以创建一个通用的函数或类,它根据输入的键类型和值类型生成特定的对象类型。

例如,你可以创建一个工厂函数,它接受键和值的类型参数,并返回一个具有这些键和值的对象:

function createRecord<K extends string, V>(keys: K[], values: V[]): Record<K, V> {return keys.reduce((obj, key, index) => ({ ...obj, [key]: values[index] }), {} as Record<K, V>);
}const record = createRecord(['a', 'b', 'c'], [1, 2, 3]);

在这个例子中,createRecord 函数接收键和值的数组,然后返回一个使用 Record 构造的对象类型,该类型确保了键和值的类型一致性。

Record 是 TypeScript 中一个强大的类型工具,它可以帮助你创建类型安全的对象,特别是在处理键值对集合时。

Record<string, any>

Record<string, any> 是 TypeScript 中的一个实用程序类型,它用于定义一个对象,该对象的键是字符串类型,而键对应的值可以是任何类型。Record 是 TypeScript 中提供的内置泛型类型之一,常用于定义对象类型的快捷方式。

Record 的语法

type Record<K extends keyof any, T> = {[P in K]: T;
};
  • K 是键的类型,通常是 stringnumbersymbol,但也可以是任何可以作为对象键的类型。
  • T 是值的类型,可以是任何类型。

使用示例

  1. 基本使用
type User = {id: number;name: string;
};let userRecord: Record<string, User> = {user1: { id: 1, name: "John" },user2: { id: 2, name: "Jane" },
};

在这个例子中,userRecord 是一个对象,其中键是字符串类型,而值是 User 类型的对象。

  1. 结合 any 类型

在你的例子中,Record<string, any> 表示一个对象,该对象的键是字符串,值可以是任何类型。

const obj: Record<string, any> = {key1: "value1",key2: 123,key3: { nestedKey: "nestedValue" },
};

在你的代码中的应用

在你的代码中,使用 Record<string, any> 来明确 filteredObj 的类型,这样 TypeScript 就知道 filteredObj 是一个对象,它的键是字符串,值可以是任何类型。这有助于消除类型检查错误,并确保代码的类型安全性和可维护性。

示例代码

const filteredObj: Record<string, any> = {length: 10,width: 20,height: 30,weight: 40,pcsPerCarton: 50,
};const KEYS_TO_COMPARE = ["length", "width", "height", "weight", "pcsPerCarton"];const resObj = KEYS_TO_COMPARE.reduce((acc, key) => {const aValue = filteredObj[key];const bValue = filteredObj[key];let ratioValue = calculateDifferenceRatio(aValue, bValue);if (ratioValue) {acc[key] = ratioValue;}return acc;
}, {} as Record<string, any>);

在这个例子中,通过将 filteredObj 类型显式声明为 Record<string, any>,你可以确保 keyfilteredObj 中是合法的,并且 filteredObj[key] 的值可以是任何类型。这样,TypeScript 可以正确推断并检查代码类型。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用约束布局该如何设置哪个视图(UILabel)的内容优先被压缩?

引言 在实际项目开发中&#xff0c;约束布局给我们带来了很大的便利&#xff0c;可以帮助我们创建灵活且响应迅速的用户界面。通常情况下&#xff0c;它都能很好地工作&#xff0c;但在一些包含许多UILabel的场景中&#xff0c;比如会话列表的UI&#xff0c;哪个视图会被优先压…

《0基础》学习Python——第二十讲__网络爬虫/<3>

一、用post请求爬取网页 同样与上一节课的get强求的内容差不多&#xff0c;即将requests.get(url,headershead)代码更换成requests.post(url,headershead),其余的即打印获取的内容&#xff0c;如果content-typejson类型的&#xff0c;打印上述代码的请求&#xff0c;则用一个命…

二叉树---二叉搜索树的最小绝对差

题目&#xff1a; 给你一个二叉搜索树的根节点 root &#xff0c;返回 树中任意两不同节点值之间的最小差值 。 差值是一个正数&#xff0c;其数值等于两值之差的绝对值。 思路&#xff1a;中序遍历二叉搜索树的顺序是递增序列&#xff0c;将该序列中的相邻值两两比较找到最…

约定(模拟赛2 T3)

题目描述 小A在你的帮助下成功打开了山洞中的机关&#xff0c;虽然他并没有找到五维空间&#xff0c;但他在山洞中发现了无尽的宝藏&#xff0c;这个消息很快就传了出去。人们为了争夺洞中的宝藏相互陷害&#xff0c;甚至引发了战争&#xff0c;世界都快要毁灭了。小A非常地难…

2024论文精读:利用大语言模型(GPT)增强上下文学习去做关系抽取任务

文章目录 1. 前置知识2. 文章通过什么来引出他要解决的问题3. 作者通过什么提出RE任务存在上面所提出的那几个问题3.1 问题一&#xff1a;ICL检索到的**示范**中实体个关系的相关性很低。3.2 问题二&#xff1a;示范中缺乏解释输入-标签映射导致ICL效果不佳。 4. 作者为了解决上…

【Git】(基础篇七)—— IntelliJIDEA集成Git

InteliJ IDEA集成Git 现在有很多的集成工具帮助我们写代码&#xff0c;使用这些工具可以帮助我们加速写代码&#xff0c;很多工具也可以集成git&#xff0c;使用图形工具管理git&#xff0c;相信了解了底层运行逻辑的你能够很快地上手使用这些工具&#xff0c;本文以InteliJ I…

7 Vue3

相比 Vue2 1. 优点 vue3支持vue2的大多数特性&#xff0c;实现对vue2的兼容vue3对比vue2具有明显的性能提升 打包大小减少41%初次渲染快55%&#xff0c;更新快133%内存使用减少54% 更好的支持TypeScript使用Proxy代替defineProperty实现响应式数据 2. 性能提升的原因 静态标…

jmeter-beanshell学习11-从文件获取指定数据

参数文件里的参数可能过段时间就不能用了&#xff0c;需要用新的参数。如果有多个交易&#xff0c;读不同的参数文件&#xff0c;但是数据还是一套&#xff0c;就要改多个参数文件。或者只想执行参数文件的某一行数据&#xff0c;又不想调整参数文件顺序。 第一个问题目前想到…

数学基础 -- 泰勒展开式

泰勒展开 泰勒展开是将一个函数在某点附近展开成幂级数的工具。具体来说&#xff0c;对于一个在某点 a a a处具有 n n n阶导数的函数 f ( x ) f(x) f(x)&#xff0c;其泰勒展开式为&#xff1a; f ( x ) f ( a ) f ′ ( a ) ( x − a ) f ′ ′ ( a ) 2 ! ( x − a ) 2 f …

Ant Design Vue中日期选择器快捷选择 presets 用法

ant写文档的纯懒狗 返回的是一个day.js对象 范围选择时可接受一个数组 具体参考 操作 Day.js 话不多说 直接上代码 <a-range-pickerv-model:value"formData.datePick"valueFormat"YYYY-MM-DD HH:mm:ss"showTime:presets"presets"change&quo…

Linux命令更新-文本处理sed

简介 sed&#xff08;Stream Editor&#xff09;是一种功能强大的文本处理工具&#xff0c;用于非交互式编辑文本文件。它可以对输入流进行一系列文本处理操作&#xff0c;例如查找、替换、删除、添加等&#xff0c;是运维人员和开发人员必备的利器。相比于其他文本编辑工具&a…

(前缀和) LeetCode 238. 除自身以外数组的乘积

一. 题目描述 原题链接 给你一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&…

敏捷开发适用于哪些项目?你用对了吗?

敏捷项目管理是一种适用于快速变化和不确定性高的项目环境的项目管理方法。因此&#xff0c;敏捷项目管理在软件开发、信息技术、互联网、市场营销、教育培训等领域得到了广泛的应用。 一、敏捷开发适合哪些项目&#xff1f; 1、需求频繁变化的项目 在传统的瀑布模型中&#…

WebRTC通话原理(SDP、STUN、 TURN、 信令服务器)

文章目录 1.媒体协商SDP简介 2.网络协商STUN的工作原理TURN工作原理 3.信令服务器信令服务器的主要功能信令服务器的实现方式 1.媒体协商 比如下面这个例子 A端与B端要想通信 A端视频采用VP8做解码&#xff0c;然后发送给B端&#xff0c;B端怎么解码&#xff1f; B端视频采用…

缓存技术:提升性能与效率的利器

在当今数字化时代&#xff0c;软件应用的性能与响应速度成为了衡量其成功与否的重要标准之一。随着数据量的爆炸性增长和用户需求的日益多样化&#xff0c;如何高效地处理这些数据并快速响应用户请求成为了软件开发中亟待解决的问题。缓存技术&#xff0c;作为提升系统性能、优…

【JavaScript】延迟加载 js 脚本

defer 属性&#xff1a;在 HTML 中通过设置 script 标签的 defer 属性来实现脚本的延迟加载&#xff0c;即脚本的下载与 HTML 的解析不会阻塞彼此&#xff0c;脚本会在 HTML 解析完成后才执⾏。async 属性&#xff1a;在 HTML 中通过设置 script 标签的 async 属性来实现脚本的…

【论文共读】【翻译】ShuffleNet v1:一种用于移动设备的极其高效的卷积神经网络

[原文地址] https://arxiv.org/pdf/1707.01083 [翻译] 0. 摘要 我们介绍了一种计算效率极高的CNN架构&#xff0c;称为ShuffleNet&#xff0c;该架构专为计算能力非常有限的移动设备&#xff08;例如&#xff0c;10-150 MFLOPs&#xff09;而设计。新架构利用了两个新操作&am…

Ubuntu 22.04.4 LTS (linux) Tomcat 下载 安装配置详细教程

1 官网下载 下载链接 2 ubuntu 服务器安装 #下载 wget https://dlcdn.apache.org/tomcat/tomcat-9/v9.0.91/bin/apache-tomcat-9.0.91.tar.gz #解压 tar zxvf apache-tomcat-9.0.91.tar.gz sudo mv apache-tomcat-9.0.91/ /data/tomcat #配置环境变量 sudo vi /etc/profil…

WebGoC题解(13) 狐猬编程:GoC L4 结业测试 第4题 找木柴

题目描述 小明今天找了n跟木柴&#xff0c;但是木柴太多了&#xff0c;小明只能拿走m根木柴&#xff0c;小明希望拿走的木柴都是剩下的木柴中最长的&#xff0c;小明还画出以下图形 例如 输入 5 3 10 20 30 40 50 小明要拿走30 40 50 这3根木柴 从大到小画出以下图形 矩形的宽…

linux cpu 占用超100% 分析。

感谢: https://www.cnblogs.com/wolfstark/p/16450131.html 总结&#xff1a; 查看进程中各个线程占用百分比 top -H -p <pid> 某线程100%了 说明 任务处理不过来 会卡 但是永远不可能超100% 系统监视器里面看到的是 所有线程占用的 总和会超100%。 所以最好的情况是&…