ts类型谓词和never

news/2024/9/19 8:04:45 标签: 笔记, 前端, javascript

ts谓词

有时会写一些用于判断变量类型的工具函数,然后根据函数返回的布尔值来做逻辑处理。比如下面的代码例子:

function isArrayBoolean(value: unknown): boolean {
  return Array.isArray(value);
}

if (isArrayBoolean(value)) {
  // TypeScript 仍然认为 value 是 unknown 类型
  value.push(4); // 会报错,需要额外的类型断言
}

但是这样还是无法直接推断出value是什么类型,也就无法使用数组类型有关的方法,我们可以使用类型谓词is,下面是修改后的代码示例:

// 使用 is
function isArray(value: unknown): value is Array<unknown> {
  return Array.isArray(value)
}

if (isArray(value)) {
  // TypeScript 知道 value 是一个数组
  value.push(4) // 不会报错
}

通过【参数 is 类型】的形式,就能很明确的告诉ts这个参数是什么类型的了。

never

never在ts中表示永远不会发生的类型,那有什么用呢?我们可以用never来表示一些发生错误时的类型,使其在编译阶段就能发现错误。下面看几个例子来理解。

1、x可以是任何类型,但是不能时间。

foo接收x作为参数,但是其类型不能是Date,这时我们就可以利用条件类型,在x类型时Date时,返回never类型,这样在编译阶段就能知道不能传递Date了。

type dontType<T, K> = T extends K ? never : T
function foo<T>(x: dontType<T, Date>) {
  console.log(x)
}
foo(44)
foo(new Date()) //报错

2、修饰Switch的default,避免忘记处理新的分支。

// 定义一个简单的联合类型
type Color = '红'
// type Color = '红' | '绿'

function getColorMessage(color: Color): string {
  switch (color) {
    case '红':
      return '停止'
    // case "绿":
    //   return "通行";
    default:
      // 确保所有颜色都被处理
      const exhaustiveCheck: never = color
      return exhaustiveCheck
  }
}

console.log(getColorMessage('红')) 

比如在color新增一个联合类型“绿”时,如果在foo函数中不做处理,返回结果就是never类型,这样就会编译时报错,也就提示我们需要进行处理。


http://www.niftyadmin.cn/n/5665233.html

相关文章

暑假考研集训营游记

文章目录 摘要&#xff1a;1.对各大辅导机构考研封闭集训营的一些个人看法&#xff1a;2.对于考研原因一些感想&#xff1a;结语 摘要&#xff1a; Ashy在暑假的时候参加了所在辅导班的为期一个月的考研封闭集训营&#xff0c;有了一些全新的感悟&#xff0c;略作记录。 1.对…

Vue 3 是 Vue.js 的下一代版本,它在许多方面都带来了显著的改进和变化,旨在提高开发效率和用户体验

性能提升&#xff1a; Vue 3 引入了一个新的编译系统&#xff08;Proxy-based&#xff09;和响应式系统&#xff08;Proxy&#xff09;&#xff0c;这极大地提高了性能。Proxy 相比 Vue 2 中的 Object.defineProperty&#xff0c;在处理嵌套对象和数组时更加高效和灵活。静态提…

python多线程程序设计 之一

python多线程程序设计 之一 全局解释器锁线程APIsthreading.active_count()threading.current_thread()threading.excepthook(args, /)threading.get_native_id()threading.main_thread()threading.stack_size([size]) 线程对象成员函数构造器start/runjoin 线程子类 实列代码 …

CentOS 中配置 OpenJDK以及多版本管理

以下是在 CentOS 中配置 OpenJDK 的步骤&#xff1a; 一、安装 OpenJDK 使用以下命令检查系统中是否已经安装了 Java&#xff1a; java -version如果已安装&#xff0c;会显示 Java 版本信息。如果未安装&#xff0c;则继续下一步。 使用 yum 安装 OpenJDK&#xff1a; yum ins…

基于OpenHarmony(开源鸿蒙)的智慧医疗综合应用系统

基于【OpenHarmony的智慧医疗综合应用系统】 一.了解OpenHarmony(开源鸿蒙)进行应用开发1.了解OpenHarmony架构2. 获取开发环境和工具3. 创建项目4. 开发应用5. 调试和测试6. 发布应用7. 学习和社区支持 二.基于开源鸿蒙(OpenHarmony)的智慧医疗综合应用系统业务场景设计1. 智能…

Acwing Trie树

Trie树&#xff08;字典树&#xff09; 主要用途&#xff1a;是用来高效存储和查找字符串集合的一种数据结构。查找时&#xff0c;可以高效的查找某个字符串是否在Trie树中出现过&#xff0c;并且可以查找出现了多少次。 利用字符串的公共前缀来减少查询时间&#xff0c;最大…

828华为云征文|华为Flexus云服务器打造《我的世界》游戏服务器

一、引言 在游戏的世界里&#xff0c;《我的世界》以其极高的自由度和创造性吸引了无数玩家。拥有一个专属的《我的世界》游戏服务器&#xff0c;可以让玩家和朋友们尽情享受定制化的游戏体验。2024年9月14日&#xff0c;我将向大家分享如何利用华为Flexus云服务器打造属于自己…

Foundation 折叠列表

Foundation 折叠列表 引言 在网页设计和开发中,折叠列表是一种常见且实用的界面元素,它允许用户展开和收起内容以节省空间并提高用户体验。Foundation 是一个流行的前端框架,它提供了一套强大的工具和组件来帮助开发者快速构建响应式和现代化的网页。本文将详细介绍如何在…