TypeScript中never类型的妙用

本文由 ChatMoney团队出品

妙用一

当我们在一个项目中,可能会去改动一个在整个项目中应用很广泛的函数的参数类型,但是可能由于代码量比较庞大,我们不好排查改了之后哪些地方会出现问题,此时我们可以使用never类型来辅助我们的函数,当我们在原有的类型基础上添加了新的类型时,可能会导致else分支中的代码逻辑出现问题,此时我们可以向下面这样写来校验。

// 当类型Method只有GET和POST时
type Method = "GET" | "POST"

function request(method: Method) {
  if (method === "GET") {
    // ...
  } else if (method === "POST") {
    //...
  } else {
    // 此时的else分支是不可能执行到的,因为TypeScript会检查到所有的可能值,如果有其他值,则会报错。
    const n: never = method;
  }
}
// 当我们新增一个类型PUT时
type Method = "GET" | "POST" | "PUT"

function request(method: Method) {
    if (method === "GET") {
      // ...
    } else if (method === "POST") {
      //...
    } else {
      // 此时应该是进入到了PUT分支,所以method应该是PUT,此时把method赋值给n由于类型不符,会抛出一个编译错误
      const n: never = method;
    }
  }

妙用二

当我们需要对一个类型取反时,可以使用类型的三目运算和类型继承来实现,代码实现如下:

// 此类型意思为,当我们传入的value类型为string时,value的类型会定义为never,此时会抛出类型错误
function myFunction<T>(value: T extends string ? never : T): T {
  return value;
}

myFunction("hello"); // 报错:Argument of type 'string' is not assignable to parameter of type 'never'.ts(2345)
myFunction(123); // 不报错
myFunction(true); // 不报错

我们可以把此类型单独做成一个类型工具,效果一样

type BandType<T, U> = T extends U? never : T;

function myFunction<T>(value: BandType<T, string>): T {
  return value;
}

关于我们

本文由ChatMoney团队出品,ChatMoney专注于AI应用落地与变现,我们提供全套、持续更新的AI源码系统与可执行的变现方案,致力于帮助更多人利用AI来变现,欢迎进入ChatMoney获取更多AI变现方案!

ChatMoney的头像ChatMoney
Previous 2024年 6月 14日 下午3:33
Next 2024年 6月 17日 下午4:55

相关推荐

  • 简单实现Viper配置管理

    本文由 ChatMoney团队出品 简介 前面实现的一个简易suno-api。是使用cookie来获取suno-token发起请求的。当时并没有通过配置的方式来获取cookie,而是直接在代码中写死了cookie的值,这种做法并不好,所以现在打算把cookie值改造为一个配置,通过viper来读取。 什么是viper Viper是一个用于Go语言的应用程序配…

    2024年 6月 6日
    303
  • 讲讲前端工程化

    本文由 ChatMoney团队出品 前言 在2010年前,前端只是一个项目的“附赠品”,对于整个项目来说他显得无关紧要,甚至没有前后端之分,但后来为了提升用户体验,工程师们不得不把界面和交互做的更加优美和便捷,于是前端慢慢地脱离出来变成了一个单独地岗位和方向。 随着前端项目复杂度的提升,传统的前端开发方式(html+css+js)已经无法满足复杂多变的开发需…

    2024年 8月 3日
    311
  • 你写的深度克隆真的“深度”吗?

    本文由 ChatMoney团队出品 深度克隆是前端开发中无法避免的话题,几乎每个前端开发者都遇到过这个话题,那我们就来看看你写的深度克隆真的正确吗? 大家先看下面这段代码: 平时开发中用这个方法或者过去用过这个方法去“深度克隆”的同学请举手🙋,我相信应该不在少数。也不是说这个方法是错的,它其实在绝大多数场景都能用,但是在一些复杂场景就会有问题,比如下面这几个…

    2024年 8月 1日
    238
  • Vue3等比例缩放图片组件

      本文由 ChatMoney团队出品 有些情况我们需要在各种刁钻的情况下都要保持图片比例不变,比如用户缩放窗口等改变布局的情况。实现原理就是通过容器的宽度和内边距在保持你想要的比例。 以下是基础功能的组件示例: <template> <div style=”position: relative” :style=”ratioStr…

    2024年 6月 7日
    497
  • PHP数据结构之栈

    本文由 ChatMoney团队出品 栈(Stack)是一种后进先出(Last In First Out, LIFO)的数据结构,它只允许在一端(称为栈顶)进行插入和删除操作。栈的应用非常广泛,例如在编程语言的函数调用中,每次函数调用都会将一个新的帧压入栈中,当函数返回时,该帧会被弹出。此外,栈还常用于解决某些算法问题,如括号匹配、深度优先搜索等。 栈的基本概…

    2024年 7月 8日
    483

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信