当前位置: 首页 > news >正文

TypeScript类型体操练习

历史小剧场

这个世界上,有两种人最痛苦,第一种是身居高位者,第二种是身居底层者,第一种人很少,第二种人很多。第一种人叫崇祯,第二种人叫百姓。
而最幸福的,就是中间那拨人,主要工作,叫做欺上瞒下,具体特点是,除了好事,什么都办;除了脸,什么都要。—《明朝那些事儿》

字符串模板与extends/infer

  • extends: 有两个作用:1、接口继承,2、类型判断(这篇文章主要是体现这个作用);
  • infer: 推导泛型参数,只在extends右边使用

案例

type str = "beyond";// 获开头
type getFirst<T> = T extends `${infer First}${infer Rest}`? First : never;
type FirstLetter = getFirst<str>; // type FirstLetter = "b"// 获取除开头的部分
type getRest<T> = T extends `${infer First}${infer Rest}` ? Rest : never;
type RestLetters = getRest<str>; // type RestLetters = "eyond"// 以y分隔
type Split<T> = T extends `${infer Front}y${infer Back}` ? Back : never;
type Splitted = Split<str>; // type Splitted = "ond"
判断开头
type startsWidth<str extends string, prefix extends string> = str extends `${prefix}${infer Rest}` ? true : false;
type startsWidthKong = startsWidth<"kong", "">; // type startsWidthKong = true
type StartsWithBe = startsWidth<str, "be">; //type StartsWithBe = true
type StartsWithC = startsWidth<str, "c">; // type StartsWithC = false
转为首字母大写
type UppercaseFirst<T extends string> = T extends `${infer First}${infer Rest}` ? `${Uppercase<First>}${Rest}` : never;
type UppercaseStr = UppercaseFirst<str>; // type UppercaseStr = "Beyond"
文本替换-替换第一个
type ReplaceOne<str extends string, from extends string, to extends string> = str extends `${infer Front}${from}${infer Rest}` ? `${Front}${to}${Rest}` : str;
type ReplaceStr = ReplaceOne<str, "o", "a">; // type ReplaceStr = "beyand"
键值对转索引 a=1 => {a:1}
type ConvertStrToRecord<str extends string> = str extends `${infer key}=${infer value}` ? { [k in key]: value } : never;
type ConvertStrToRecordStr = ConvertStrToRecord<"a=1">; 
// type ConvertStrToIndexStr = {// a: "1";
// }

as 重映射-索引的重命名

索引转大写
interface IOut {aaa: 1,bbb: 2,fun: () => void
}
type UpperKeys<T extends Record<string, any>> = {[K in keyof T as (T[K] extends Function ? K : Uppercase<K>)]: T[K]
}
type res = UpperKeys<IOut>;
// type res = {
//     AAA: 1;
//     BBB: 2;
//     fun: () => void;
// }
合并索引
interface IOut2 {ccc: 3,ddd: 4
}
type CombineIndex<A extends Record<string, any>, B extends Record<string, any>> = {[K in keyof A | keyof B] : K extends keyof A ? A[K] : K extends keyof B ? B[K] : never
}
type combine = CombineIndex<IOut, IOut2>;
// type combine = {
//     aaa: 1;
//     bbb: 2;
//     fun: () => void;
//     ccc: 3;
//     ddd: 4;
// }

巧用递归

文本替换-替换所有
type ReplaceAll<Str extends string, From extends string, To extends string> = Str extends `${infer Front}${From}${infer Rest}` ? `${Front}${To}${ReplaceAll<Rest, From, To>}` : Str;
type ReplaceAllStr = ReplaceAll<"12333333456", "3", "A">; // type ReplaceAllStr = "12AAAAAA456"
字符串反转
type Reverse<Str extends string, Res extends string = ""> = Str extends `${infer First}${infer Rest}` ? Reverse<Rest, `${First}${Res}`> : Res;
type ReverseStr = Reverse<"hello">; // type ReverseStr = "olleh"

综合

字符串解析-初级

例如:我们要将 a=1&b=2&c=3 转为 {a:1, b:2, c:3}
那么,我们要有按这三步走

  1. &分割取 键值对 处理
  2. 处理单个的 键值对 转换为 索引类型
  3. 把 转换后的 索引类型 合并
type Parse<Str extends string, Res extends Record<string, any> = {}> = Str extends `${infer One}&${infer Rest}` ?Parse<Rest, CombineIndex<Res, ConvertStrToRecord<One>>> :CombineIndex<Res, ConvertStrToRecord<Str>>type parseToRecord = Parse<"a=1&b=2&c=3">; // type parseToRecord = {a: "1", b: "2", c: "3"}
字符串解析-升级
  • 如果只有键没有值,则返回 {key: true};
  • 合并重复索引。例如 a=1&a=2 转为 {a: [‘1’, ‘2’]};
  • 合并的值不能重复。例如 a=1&a=2&a=2 转为 {a: [‘1’, ‘2’]};
type ConvertStrToRecordUp<Str extends string> = Str extends `${infer Key}=${infer Value}` ? { [K in Key] : Value } : Str extends `${infer Key}` ? { [K in Key]: true } : {};
type ConvertStrToRecordUpStr = ConvertStrToRecordUp<"a">;
// type ConvertStrToRecordUpStr = {
//     a: true;
// }// 合并重复索引
type CheckDuplicate<A extends Record<string, any>, B extends Record<string, any>> = keyof B extends keyof A ? AddR<A, B> : CombineIndex<A, B>;
type AddR<A extends Record<string, any>, B extends Record<string, any>> = {[K in keyof A] : K extends keyof B ?CheckInclue<A[K], B[K]> extends true ? A[K] :  // 重复索引,合并值,值不能重复A[K] extends any[] ? [...A[K], B[K]] : [A[K], B[K]] : A[K]
}type CheckInclue<A extends any[], B extends string> = A extends [infer First, ...infer Rest] ? First extends B ? true : CheckInclue<Rest, B> : false;
type checkIncludeDemo = CheckInclue<["a", "b", "c"], "a">; // type checkIncludeDemo = truetype ParseUp<Str extends string, Res extends Record<string, any> = {}> = Str extends `${infer One}&${infer Rest}` ?ParseUp<Rest, CheckDuplicate<Res, ConvertStrToRecordUp<One>>> :CheckDuplicate<Res, ConvertStrToRecordUp<Str>>type parseToRecordUp = ParseUp<"a=1&b&a=2&a=3&c&d=4&e&e=10&a=3">; 
// type parseToRecordUp = {
//     b: true;
//     c: true;
//     a: ["1", "2", "3"];
//     e: [true, "10"];
//     d: "4";
// }

相关文章:

  • 网络、HTTP、HTTPS、Session、Cookie、UDP、TCP
  • 揭秘Tensor Core黑科技:如何让AI计算速度飞跃
  • mysql8忘记密码重置密码和创建新用户
  • Golang协程和通道
  • 数据结构的希尔排序(c语言版)
  • MySQL 高级 - 第十章 | 性能分析工具的使用
  • springcloud-服务拆分与远程调用
  • 所以研究生有不变胖的吗?
  • 【考研数据结构知识点详解及整理——C语言描述】第一章算法和算法评价
  • 3步骤找回丢失文件!EasyRecovery让你轻松应对数据灾难!
  • C++的第一道门坎:类与对象(二)
  • NoSQL数据库技术与应用 教学设计
  • 代码随想录算法训练营第二十一天 | 530.二叉搜索树的最小绝对差、501.二叉搜索树中的众数、236. 二叉树的最近公共祖先
  • NLP技术发展和相关书籍分享
  • MTK Android9.0 给vendor下文件夹权限,用于读取文件列表
  • 分享一款快速APP功能测试工具
  • Java面向对象及其三大特征
  • Netty 4.1 源代码学习:线程模型
  • PAT A1092
  • STAR法则
  • tweak 支持第三方库
  • 案例分享〡三拾众筹持续交付开发流程支撑创新业务
  • 动态魔术使用DBMS_SQL
  • 对话:中国为什么有前途/ 写给中国的经济学
  • 给github项目添加CI badge
  • 罗辑思维在全链路压测方面的实践和工作笔记
  • 如何设计一个微型分布式架构?
  • 使用common-codec进行md5加密
  • 使用putty远程连接linux
  • 我的业余项目总结
  • 以太坊客户端Geth命令参数详解
  • 用quicker-worker.js轻松跑一个大数据遍历
  • 【运维趟坑回忆录 开篇】初入初创, 一脸懵
  • 2017年360最后一道编程题
  • UI设计初学者应该如何入门?
  • 分布式关系型数据库服务 DRDS 支持显示的 Prepare 及逻辑库锁功能等多项能力 ...
  • ​插件化DPI在商用WIFI中的价值
  • #Java第九次作业--输入输出流和文件操作
  • (33)STM32——485实验笔记
  • (二)PySpark3:SparkSQL编程
  • (二)换源+apt-get基础配置+搜狗拼音
  • (三)Kafka 监控之 Streams 监控(Streams Monitoring)和其他
  • (十二)springboot实战——SSE服务推送事件案例实现
  • (转)大型网站架构演变和知识体系
  • *setTimeout实现text输入在用户停顿时才调用事件!*
  • .cfg\.dat\.mak(持续补充)
  • .Net CF下精确的计时器
  • .NET MAUI Sqlite程序应用-数据库配置(一)
  • .Net6 Api Swagger配置
  • @AliasFor注解
  • @Autowired和@Resource的区别
  • @SentinelResource详解
  • []Telit UC864E 拨号上网
  • [2015][note]基于薄向列液晶层的可调谐THz fishnet超材料快速开关——
  • [AutoSar]BSW_OS 02 Autosar OS_STACK