【类型挑战】第一个元素,难度⭐️

简介: 【类型挑战】第一个元素,难度⭐️

知识运用:


  1. 条件类型的使用:文档地址
  2. infer关键字也参照条件类型使用的文档
  3. 在泛型中对类型做约束:文档地址
  4. 索引访问类型:文档地址


题目分析:


题目地址:14-easy-firstimage.png

如上图所示我们需要设计一个通用的类型转换工具来提取一组类型中的第一个元素类型,类似于我们数组直接使用0号下标获取第一个元素。


题目解答:


测试用例:

通过测试用例可以看到仅当我们传入的是一个数组或元祖时才可以返回第一个元素,反之则返回never;

/* _____________ 测试用例 _____________ */
import { Equal, Expect } from '@type-challenges/utils'
type cases = [
  Expect<Equal<First<[3, 2, 1]>, 3>>,
  Expect<Equal<First<[() => 123, { a: string }]>, () => 123>>,
  Expect<Equal<First<[]>, never>>,
  Expect<Equal<First<[undefined]>, undefined>>
]
type errors = [
  // @ts-expect-error
  First<'notArray'>,
  // @ts-expect-error
  First<{ 0: 'arrayLike' }>
]


答案及解析:

  1. 我们在Js开发数组取值的时候往往需要先看一下数组是不是有内容,这个在Ts类型开发中使用 T extends xxx ? 1 :2;的形式,参照三元表达式的操作。extends在这里作用同if。
  2. 为了满足传入的必须是数组我们还是通过在泛型中使用extends来做约束。
  3. 答案二的解法运用到了数组解构的形式,可以参照ES6中的数组解构来理解。
/* _____________ 答案1 _____________ */
type First<T extends any[]> = T extends [] ? never : T[0];
/* _____________ 答案2 _____________ */
type First<T extends any[]> = T extends [infer F, ...unknown[]] ? F : never;
复制代码


去演练场验证答案



相关文章
|
JavaScript
vue中有关表格中的表格头中添加悬浮提示的ui问题
vue中有关表格中的表格头中添加悬浮提示的ui问题
410 0
|
11月前
|
存储 编译器 C语言
【C语言程序设计——入门】C语言入门与基础语法(头歌实践教学平台习题)【合集】
本文档介绍了C语言环境配置和编程任务,主要内容包括: - **C语言环境配置**:详细讲解了在Windows系统上配置C语言开发环境的步骤。 - **第1关:程序改错**:包含任务描述、相关知识(如头文件引用、基本语法规则)、编程要求、测试说明及通关代码。 - **第2关:scanf函数**:涉及`scanf`和`printf`函数的格式与使用方法,提供编程要求、测试说明及通关代码。 文档结构清晰,涵盖从环境搭建到具体编程任务的完整流程,适合初学者学习和实践。
354 4
|
9月前
|
数据采集 机器学习/深度学习 数据挖掘
基于DeepSeek的多模态融合技术:实现图像、视频与音频的协同分析
随着多媒体数据的爆炸式增长,单一模态数据分析已无法满足复杂场景需求。多模态融合技术通过整合图像、视频、音频等多源数据,提供更全面精准的分析结果。DeepSeek作为强大的深度学习框架,在多模态融合领域展现巨大潜力。本文深入探讨基于DeepSeek的多模态融合技术,结合代码示例展示其在图像、视频与音频协同分析中的实际应用,涵盖数据预处理、特征融合、模型训练及评估等环节,并展望未来发展方向。
1845 13
|
Java
Java将OffsetDateTime格式化为 yyyy-MM-dd HH:mm:ss 如何写代码?
Java将OffsetDateTime格式化为 yyyy-MM-dd HH:mm:ss 如何写代码?
387 0
|
机器学习/深度学习 监控 安全
火焰检测识别
火焰识别技术利用深度学习算法,实现在火灾监测、工业安全、智能家居等领域的自动化检测。通过卷积神经网络(CNN)等模型,该技术能有效识别火焰,提高响应速度和安全性。文章介绍了火焰识别的应用场景、技术挑战、实现框架及代码示例,帮助读者深入了解这一技术。
|
机器学习/深度学习 算法 数据挖掘
scikit-learn.datasets 机器学习数据集
scikit-learn.datasets 机器学习数据集
325 0
|
消息中间件 监控 供应链
深度剖析 RocketMQ 事务消息!
本文深入探讨了 RocketMQ 的事务消息原理及其应用场景。通过详细的源码分析,阐述了事务消息的基本流程,包括准备阶段、提交阶段及补偿机制。文章还提供了示例代码,帮助读者更好地理解整个过程。此外,还讨论了事务消息的优缺点、适用场景及注意事项,如确保本地事务的幂等性、合理设置超时时间等。尽管事务消息增加了系统复杂性,但在需要保证消息一致性的场景中,它仍是一种高效的解决方案。
1098 2
|
缓存 Java API
API接口性能优化管理
在数字化时代,API性能优化对于提升软件效率和用户体验至关重要。本文介绍了多种优化方法:配置优化包括调整JVM参数等;代码层面减少重复调用并批量操作数据库;池化技术如线程池和HTTP连接池能有效利用资源;数据库优化通过索引提高查询速度;异步处理则使主流程业务不受阻塞;缓存策略如Redis缓存减少数据库访问;可观测性工具如日志平台和APM帮助监控性能。综合运用这些方法,可根据业务需求持续调整优化,显著提升API性能及用户体验。
|
机器学习/深度学习 并行计算 算法
模型压缩部署神技 | CNN与Transformer通用,让ConvNeXt精度几乎无损,速度提升40%
模型压缩部署神技 | CNN与Transformer通用,让ConvNeXt精度几乎无损,速度提升40%
344 0
|
网络协议 安全 Unix
VSFTP超详细安装教程
VSFTP超详细安装教程