TypeScript-test-flat

发表于 2023-11-30 分类于 web

最近写的TS感觉还不错，找了一些TS的练习题做一下

相关练习题地址：重学TS 2.0 这个2.0 指的是作者第二次学习TS，并非指代TS的版本号
今天练习了第六题

定义一个 NativeFlat 工具类型，支持把数组类型拍平（扁平化）。具体的使用示例如下所示

type NativeFlat<T extends any[]> = unknown // 你的实现代码

// 测试用例
type NaiveResult = NaiveFlat<[['a'], ['b', 'c'], ['d']]>
// NaiveResult: "a" | "b" | "c" | "d" | "e"

这个题目比较有意思

第一步确定函数的出入参

type NativeFlat<T extends any[]> = {
    [P in keyof T]:T[P]
}[number]

1.首先定义一个泛型约束,{}[number] 的对象来表示数组
1. [P in keyof T] 是这个对应的key ，T[P]为对应的值

第二步就是对T[P]这个值继续约束

type NativeFlat<T extends any[]> = {
[P in keyof T]:T[P] extends any[]?NativeFlat<T[P]>:T[P]
}[number]

1. T[P] extends any[] 判断 T[P]是否还是数组
1. 若T[P]依然是数组则继续执行NativeFlat<T[P]>
1. 否则返回T[P]

至此这个题的完整解法如下

type NaiveFlat<T extends any[]> ={
    [P in keyof T]:T[P] extends any[]?NaiveFlat<T[P]>:T[P]
}[number] // 你的实现代码

// 测试用例：
type NaiveResult = NaiveFlat<[['a'], ['b', 'c'], ['d']]>
// 测试用例
type Deep = [['a'], ['b', 'c'], [['d']], [[[['e']]]]];
type DeepTestResult = NaiveFlat<Deep>  
// DeepTestResult: "a" | "b" | "c" | "d" | "e"

本文作者：番茄炒蛋
本文地址： https://www.noway.pub/2023/11/30/TypeScript-test-flat/
版权声明：转载请注明出处！

0%