TypeScript26(TS进阶用法Record Readonly)

news2024/11/15 18:43:00

Readonly

Readonly与我们上一章节学的Partial 很相似,只是把? 替换成了 Readonly

// 源码
type Readonly<T> = {
    readonly [P in keyof T]: T[P];
};

疑问:

keyof 是干什么的?

in 是干什么的?

Readonly 是将该属性变为只读?

T[P] 是干什么的?

解答:

1 keyof:将一个接口对象的全部属性取出来变成联合类型;

2 in :我们可以理解成for in P 就是key 遍历 keyof T 就是联合类型的每一项;

3 Readonly :这个操作就是将每一个属性变成只读

4 T[P] :索引访问操作符,与 JavaScript 种访问属性值的操作类似

示例代码:

// 源码
type R<T> = {
  readonly [P in keyof T]:T[P]
}

// 使用
type Person ={
  name:string,
  age:number,
  text:string
}

type man = R<Person>

把鼠标移至man上最终的显示如下:

 Record

源码

type Record<K extends keyof any, T> = {
    [P in K]: T;
};

说明

1 keyof any :返回 string number symbol 的联合类型

2 in :我们可以理解成for in P 就是key 遍历 keyof any 就是string number symbol类型的每一项

3 extends:来约束我们的类型

4 T :直接返回类型

做到了约束 对象的key 同时约束了 value

代码示例如下:

// 源码
type Rec<K extends keyof any, T> = {
  [P in K]: T
}

// 使用
type Person ={
  name:string,
  age:number,
  text:string
}

// type  K = 'A' | 'B' | 'C'
//如果将K换成数字,那么obj:B中的key也必须换成相应的数字
type K = 1 | 2 | 3

type B = Rec<K, Person>

// let obj:B = {
//   A:{name:'小剑', age:18, text:'123'},
//   B:{name:'小剑', age:19, text:'456'},
//   C:{name:'小剑', age:20, text:'789'}
// }
let obj:B = {
  1:{name:'小剑', age:18, text:'123'},
  2:{name:'小剑', age:19, text:'456'},
  3:{name:'小剑', age:20, text:'789'}
}

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

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

相关文章

【HBU】数据结构第一次月测题(线性结构)

数据结构第一次月测题 判断题&#xff1a; 1.在具有N个结点的单链表中&#xff0c;访问结点和增加结点的时间复杂度分别对应为O&#xff08;1&#xff09;和O&#xff08;N&#xff09; F 访问节点的时间复杂度为O(N) 2.对于顺序存储长度为N的线性表&#xff0c;…

DataBinding原理----双向绑定(4)

前面的几种文章分析了DataBinding单向数据绑定的原理&#xff0c;今天来看看双向数据绑定是怎么回事。 我们知道单向绑定是在数据发生变化的时候能够通知到UI&#xff0c;让数据的变化能够及时反应到UI上&#xff1b;而双向绑定则是不仅要让数据的变化能够反馈到UI上&#xff0…

web前端-javascript-立即执行函数(说明、例子)

立即执行函数 /* (function(){alert("我是一个匿名函数~~~"); })(); */(function (a, b) {console.log("a " a);console.log("b " b); })(123, 456);1. 说明 函数定义完&#xff0c;立即被调用&#xff0c;这种函数叫做立即执行函数立即执…

Twitter群推解锁流量大门的钥匙

Twitter作为全球最知名的社交媒体平台之一&#xff0c;对海外营销有着巨大的影响力&#xff0c;是外贸企业进行群推、群发、引流必不可少的平台。那么要想通过推特群推、推特群发打开流量的大门&#xff0c;这里有几点值得大家注意&#xff0c;帮助你更好的驾驭流量&#xff1a…

虚拟机安装zookeeper集群

一、准备 克隆原先的虚拟机;因为是从原先已有jdk和zk的linux虚拟机克隆过来的,所以克隆的虚拟机上是一样的! 三台虚拟机,我采用的是:zk的ip不一样,端口一样 修改每台虚拟机上环境变量,zk配置文件 修改zookeeper配置文件,采用默认端口,配置主从节点

Bootstrap主页面搭建(十四)

创建主页面&#xff1a;index.jsp&#xff1a; 引入bootstrap依赖&#xff1a; 首先写导航条&#xff0c;复制代码更改&#xff1a; <!--导航条--> <nav class"navbar navbar-inverse"><div class"container-fluid"><!-- Brand and…

Nginx配置实例-动静分离

1、什么是动静分离 Nginx动静分离简单来说就是把动态跟静态请求分开&#xff0c;不能理解成只是单纯的把动态页面和 静态页面物理分离。严格意义上说应该是动态请求跟静态请求分开&#xff0c;可以理解成使用Nginx 处理静态页面&#xff0c;Tomcat处理动态页面。 动静分离从目…

Project joee 算法开发日志(一)

目录一. 下载并安装TensorRT1.1 下载安装TensorRT1.2 验证TensorRT安装是否成功二. 安装并测试Windows预测库2.1 安装cuda11.0_cudnn8.0_avx_mkl-trt7.2.1.6 预测库2.2 测试精度损失2.3 推理速度测试三. 总结开发机器配置&#xff1a;CPU: AMD5800 8core 16ThreadGPU: NVIDIA G…

微信支付回调,内网穿透详细过程

文章目录支付回调接口通过Ngrok进行内网穿透步骤1. 根据邮箱注册一个账号2. 获取隧道id3.下载Ngrok客户端4. 双击这个 Sunny-Ngrok启动工具.bat 文件5. 填写你的 隧道id 回车6.客户端启动成功7. 所以你的notify_url对应的value需要改为内网穿透的地址为8.支付成功之后微信平台会…

分面中添加直线

简介 这篇也是分享最近统计建模中所绘制的一副图形。总体而言和前面的几篇&#xff1a;xxx 类似。都是从“数据导入”到“基于分面的可视化”。但是本文的小技巧是&#xff0c;在不同的分面中添加直线。最后得到的图形如下&#xff1a; 注意&#xff1a;本文数据和代码在公众号…

交易所通用质押式回购

一、专业术语 逆回购&#xff1a;指资金融出方将资金融给资金融入方&#xff0c;收取有价证券作为质押&#xff0c;并在未来收回本息&#xff0c;并解除有价证券质押的交易行为。 债券通用质押式回购交易&#xff1a;&#xff08;简称“通用回购”&#xff09;是指资金融入方…

划分成绩ABCD

已知成绩等级划分为{“A”:[90~100],"B":[80~89],"c":[60~79],"D":[0~59]} 1、随机生成20个整数&#xff0c;范围0-100 2、按等级归类&#xff0c;输出成绩等级列表字典如下&#xff1a; {A: [96, 96, 97, 97, 100, 100], B: [86], C: [71, 7…

Python学习基础笔记二十二——生成器

一个包含yield关键字的函数就是一个生成器函数。yield可以为我们从函数中返回值&#xff0c;但是yield又不同于return&#xff0c;return的执行意味着程序的结束&#xff0c;调用生成器函数不会得到返回的具体的值&#xff0c;而是得到一个可迭代的对象。每一次获取这个可迭代对…

微机原理与接口技术:数模转换和模数转换 详细笔记

文章目录1.数模转换1.1.数模转换原理1.1.1.权电阻D/A转换器1.1.2.R-2R T型电阻网络D/A转换器1.1.3.补充 D/A转换器的主要技术指标1.2.D/A转换芯片——DAC08321.2.1.引脚介绍1.2.2.工作方式直通输入方式单缓冲方式双缓冲方式2.模数转换2.1.信号变换中的采样、量化和编码2.1.1.采…

『NLP学习笔记』TextCNN文本分类原理及Pytorch实现

TextCNN文本分类原理及Pytorch实现 文章目录一. TextCNN网络结构1.1. CNN在文本分类上得应用1.2. 回顾CNN以及Pytorch解析1.2.1. CNN特点1.2.2. 一维卷积Conv1d1.2.3. 二维卷积 Conv2d1.2.3. 三维卷积 Conv3d1.2.4. 池化(pooling)操作1.2.4. nn.BatchNorm操作1.3. nn.ModuleLi…

大数据之数据的压缩与存储

文章目录前言一、Hive的压缩方式&#xff08;一&#xff09; 概念&#xff08;二&#xff09; 简介&#xff08;三&#xff09; 数据分层的压缩方式选择&#xff08;四&#xff09;开启Map输出阶段压缩&#xff08;五&#xff09;开启Reduce输出阶段压缩二、 Hive的数据存储格式…

再有人问你kafka 把这篇扔给他(建议收藏)

前言 最近重新读起kafka的内容&#xff0c;看到kafka官网文档里&#xff0c;有专门一栏讲kafka的设计&#xff0c;觉得很受益。我们常常会知道这个中间件是什么&#xff0c;是什么机制&#xff0c;这次想换个角度来聊&#xff0c;它在设计消息系统的时候&#xff0c;都做了哪些…

火山引擎虚拟数字人技术与应用

导读&#xff1a;火山引擎正在打造完善的虚拟数字人技术和应用体系&#xff0c;那么火山引擎是如何定义虚拟数字人的呢&#xff1f;火山引擎 2D 虚拟数字人和 3D 数字人采用了怎样先进的技术&#xff1f;火山引擎数字人有哪些应用和前景展望&#xff1f;今天我们就来一起探秘火…

【Transformer】Transformer理论知识

Transformer目录Transformer介绍Seq2seq结构Encoder结构Decoder结构Autoregressive Decoder&#xff08;AT&#xff09;&#xff1a;Encoder和Decoder对比和联系Cross attention&#xff1a;Non-autoregressive Decoder&#xff08;NAT&#xff09;&#xff1a;训练Seq2seq Mod…

基于ssm高校档案管理系统源码

档案管理作为企事业单位管理工作的基础&#xff0c;档案是企事业单位建设信息系统的重要组成部分&#xff0c;档案是提高企事业单位工作质量和工作效率的必要条件&#xff0c;甚至是维护历史真实面貌的一项重要工作。 1、档案信息数字化能够提供档案信息方便快捷的服务方式。 数…