JavaScript async 与 await 怎么在可辨识联合中使用

秋强同学_9890

秋强同学_9890

2026-11-14

767人浏览

原创

在可辨识联合(discriminated union)中使用 async/await 的核心做法是:确保联合类型中的每个分支都返回相同的基础 promise 类型,并在处理函数中通过 switch 语句对标签属性进行匹配,直接 await 各分支的异步操作。这样做能利用 typescript 的类型收窄特性,保证每个分支返回值的类型安全,避免混合不同结构的 promise 导致类型推断失败。

JavaScript async 与 await 怎么在可辨识联合中使用

如何定义支持异步操作的联合类型结构

定义联合类型时,必须为每个对象字面量添加唯一的字符串字面量类型作为判别字段(如 type),并确保所有分支的返回值类型统一收敛到同一个 Promise 泛型中。例如,定义一个包含 fetch 和 cache 两种策略的联合类型,两者都必须返回 Promise,这样在后续处理时才能安全地进行类型收窄。

JavaScript async 与 await 怎么在可辨识联合中使用

interface FetchStrategy {
  type: 'fetch';
  url: string;
}

interface CacheStrategy {
  type: 'cache';
  key: string;
}

type Strategy = FetchStrategy | CacheStrategy;

async function executeStrategy(strategy: Strategy): Promise<string> {
  if (strategy.type === 'fetch') {
    return await fetch(strategy.url).then(r => r.text());
  } else {
    return await getCachedData(strategy.key);
  }
}</string>

上述代码中,executeStrategy 函数接收一个 Strategy 联合类型。当 strategy.type 被判断为 'fetch' 时,TypeScript 知道此时 strategy 的具体类型为 FetchStrategy,因此可以安全访问 url 属性。同理,在 else 分支中,类型自动收窄为 CacheStrategy,可以访问 key 属性。两个分支最终都返回 Promise,符合函数签名要求。

如何在 switch 语句中正确展开异步逻辑

使用 switch 语句处理联合类型时,需要在每个 case 块内直接执行对应的异步操作并 await 结果。关键在于每个 case 必须明确返回数据,且不能遗漏任何联合类型中的分支,否则 TypeScript 会报错提示非穷尽匹配。同时,要确保每个分支的异步操作完成后返回的数据类型一致。

JavaScript 测试模式
JavaScript 测试模式

使用 Jest、Vitest 和 Testing Library 实施全面的测试策略,包括单元测试、集成测试和端到端测试,涵盖模拟、测试夹具和测试驱动开发。在编

下载

JavaScript async 与 await 怎么在可辨识联合中使用

async function processRequest(strategy: Strategy) {
  switch (strategy.type) {
    case 'fetch':
      const response = await fetch(strategy.url);
      if (!response.ok) throw new Error('Network error');
      return await response.json();
    case 'cache':
      const cached = await db.lookup(strategy.key);
      if (!cached) throw new Error('Cache miss');
      return cached;
    default:
      const _exhaustiveCheck: never = strategy;
      throw new Error('Unknown strategy');
  }
}

在 processRequest 函数中,switch 语句根据 strategy.type 的值分发逻辑。在 'fetch' 分支中,先 await HTTP 请求,再 await JSON 解析,最终返回解析后的对象。在 'cache' 分支中,await 数据库查询并返回结果。最后的 default 分支使用了 never 类型检查,如果未来新增联合类型分支而未在此处处理,编译器会报错,从而保证类型的完整性。

当异步操作抛出异常时如何处理类型收窄

在可辨识联合的异步处理中,如果某个分支的异步操作抛出异常,类型收窄依然有效,但需要确保错误处理逻辑覆盖所有分支。通常的做法是在每个 case 内部捕获异常或让异常向上冒泡,同时在函数顶层使用 try/catch 统一处理。由于每个分支返回的是相同的 Promise 类型,异常也会以统一的 Promise 形式传播,不会影响联合类型的结构一致性。

Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

javascript java

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
js获取数组长度的方法
js获取数组长度的方法

在js中,可以利用array对象的length属性来获取数组长度,该属性可设置或返回数组中元素的数目,只需要使用“array.length”语句即可返回表示数组对象的元素个数的数值,也就是长度值。php中文网还提供JavaScript数组的相关下载、相关课程等内容,供大家免费下载使用。

2023.06.20

5906

5

js刷新当前页面
js刷新当前页面

js刷新当前页面的方法:1、reload方法,该方法强迫浏览器刷新当前页面,语法为“location.reload([bForceGet]) ”;2、replace方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL,语法为“location.replace(URL) ”。php中文网为大家带来了js刷新当前页面的相关知识、以及相关文章等内容

2023.07.04

1409

3

js四舍五入
js四舍五入

js四舍五入的方法:1、tofixed方法,可把 Number 四舍五入为指定小数位数的数字;2、round() 方法,可把一个数字舍入为最接近的整数。php中文网为大家带来了js四舍五入的相关知识、以及相关文章等内容

2023.07.04

5824

6

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

2023.09.01

1060

4

JavaScript转义字符
JavaScript转义字符

JavaScript中的转义字符是反斜杠和引号,可以在字符串中表示特殊字符或改变字符的含义。本专题为大家提供转义字符相关的文章、下载、课程内容,供大家免费下载体验。

2023.09.04

2036

5

js生成随机数的方法
js生成随机数的方法

js生成随机数的方法有:1、使用random函数生成0-1之间的随机数;2、使用random函数和特定范围来生成随机整数;3、使用random函数和round函数生成0-99之间的随机整数;4、使用random函数和其他函数生成更复杂的随机数;5、使用random函数和其他函数生成范围内的随机小数;6、使用random函数和其他函数生成范围内的随机整数或小数。

2023.09.04

4005

4

如何启用JavaScript
如何启用JavaScript

JavaScript启用方法有内联脚本、内部脚本、外部脚本和异步加载。详细介绍:1、内联脚本是将JavaScript代码直接嵌入到HTML标签中;2、内部脚本是将JavaScript代码放置在HTML文件的`<script>`标签中;3、外部脚本是将JavaScript代码放置在一个独立的文件;4、外部脚本是将JavaScript代码放置在一个独立的文件。

2023.09.12

5313

6

Js中Symbol类详解
Js中Symbol类详解

javascript中的Symbol数据类型是一种基本数据类型,用于表示独一无二的值。Symbol的特点:1、独一无二,每个Symbol值都是唯一的,不会与其他任何值相等;2、不可变性,Symbol值一旦创建,就不能修改或者重新赋值;3、隐藏性,Symbol值不会被隐式转换为其他类型;4、无法枚举,Symbol值作为对象的属性名时,默认是不可枚举的。

2023.09.20

3480

5

java访问控制修饰符介绍
java访问控制修饰符介绍

java访问控制修饰符有四种,分别是public、protected、private、默认访问修饰符。详细介绍:1、public,public是最宽松的访问控制修饰符,被修饰的类、方法和变量可以被任何其他类访问,当一个类、方法或变量被声明为public时,它们可以在任何地方被访问,无论是同一个包中的类还是不同包中的类;2、protected修饰符等等。

2023.09.20

1128

7

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.5万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.8万人学习