Jest中测试异步函数抛出异常:rejects 的正确用法解析

Jest中测试异步函数抛出异常:rejects 的正确用法解析

本文深入探讨了在Jest中测试预期抛出异常的异步函数的正确方法。我们将比较两种常见的测试模式,并明确指出 await expect(asyncFun()).rejects.toThrowError() 是推荐且符合Jest rejects 匹配器设计初衷的用法。文章将解释 rejects 期望接收一个 Promise 对象而非函数,以帮助开发者避免测试中的常见误区。

异步函数异常测试的挑战

在现代javascript应用中,异步操作无处不在。当这些异步操作在执行过程中抛出异常时,我们需要一种可靠的方式来测试这些异常是否按预期被捕获和处理。jest作为流行的javascript测试框架,提供了强大的工具来处理这类场景。然而,对于异步函数抛出异常的测试,开发者有时会混淆其正确的使用方式。

两种测试模式的对比

在Jest中测试一个预期会拒绝(即抛出异常)的异步函数时,我们可能会遇到以下两种常见的代码模式:

模式一:直接调用异步函数并传入其返回的 Promise

// 假设 asyncFun 是一个返回 Promise 的异步函数await expect(asyncFun()).rejects.toThrowError(errorObj);

模式二:将异步函数的调用包裹在一个新的异步函数中

// 假设 asyncFun 是一个返回 Promise 的异步函数await expect(async () => {  await asyncFun();}).rejects.toThrowError(errorObj);

那么,这两种模式是否存在差异,哪一种是推荐的用法呢?答案是肯定的,它们之间存在显著差异,并且模式一才是Jest官方文档推荐且设计意图所在的用法。

rejects 匹配器的核心原理

理解这两种模式差异的关键在于深入理解Jest的 rejects 匹配器的工作原理。

Jest的 rejects 匹配器专门用于测试 Promise 是否被拒绝。它的设计初衷是接收一个 Promise 对象作为 expect() 的参数。当 expect() 接收到一个 Promise 时,rejects 会等待该 Promise 的状态变为拒绝(rejected),然后将拒绝的原因与后续的匹配器(如 toThrowError)进行比较。

与同步 toThrow() 的对比:为了更好地理解 rejects,我们可以将其与同步的 toThrow() 匹配器进行对比。toThrow() 匹配器用于测试同步函数是否抛出异常。它的用法是 expect(() => { /* 同步函数调用 */ }).toThrowError(errorObj)。在这里,expect() 接收的是一个函数,Jest会执行这个函数,并捕获它可能抛出的同步异常。

模式二的问题所在:模式二 await expect(async () => { await asyncFun() }).rejects.toThrowError(errorObj) 的问题在于,它将一个函数(async () => { await asyncFun() })传递给了 expect(),而不是一个 Promise。尽管在某些Jest版本或特定场景下,这种写法可能“看起来”能工作,但它并非 rejects 匹配器的设计意图。rejects 期望直接操作一个 Promise,而不是去执行一个函数来获取 Promise。这种不符合设计意图的用法可能导致:

行为不一致性: 在不同Jest版本或配置下,其行为可能不一致或不可预测。可读性降低: 引入了不必要的函数包装,使代码更复杂。与文档不符: 偏离了Jest官方文档推荐的最佳实践。

正确实践与示例代码

基于上述分析,测试异步函数抛出异常的正确且推荐的方式是模式一:直接将异步函数调用后返回的 Promise 传递给 expect()。

示例代码:

// 假设我们有一个异步函数,它在某些条件下会抛出错误async function fetchData(shouldFail) {  return new Promise((resolve, reject) => {    setTimeout(() => {      if (shouldFail) {        reject(new Error('数据加载失败!'));      } else {        resolve('数据加载成功!');      }    }, 100);  });}// 异步函数示例,使用 async/await 语法async function processData(input) {  if (input === 'error') {    throw new Error('无效的输入');  }  return `处理结果: ${input}`;}describe('异步函数异常测试', () => {  test('fetchData 函数应在失败时拒绝并抛出特定错误', async () => {    // 正确用法:直接调用 fetchData(),它返回一个 Promise    await expect(fetchData(true)).rejects.toThrowError('数据加载失败!');    await expect(fetchData(true)).rejects.toThrowError(Error); // 也可以检查错误类型  });  test('processData 函数应在输入错误时抛出异常', async () => {    // 正确用法:直接调用 processData(),它返回一个 Promise    await expect(processData('error')).rejects.toThrowError('无效的输入');    await expect(processData('error')).rejects.toThrowError(new Error('无效的输入'));  });  // 错误用法示例(不推荐)  test('不推荐的异步异常测试模式', async () => {    // 尽管这个测试可能通过,但它不是 Jest rejects 匹配器的设计意图    // await expect(async () => {    //   await fetchData(true);    // }).rejects.toThrowError('数据加载失败!');    //    // await expect(async () => {    //   await processData('error');    // }).rejects.toThrowError('无效的输入');  });  test('fetchData 函数在成功时应解决', async () => {    await expect(fetchData(false)).resolves.toBe('数据加载成功!');  });});

在上面的示例中,await expect(fetchData(true)) 和 await expect(processData(‘error’)) 是正确的用法。fetchData(true) 和 processData(‘error’) 会立即被调用并返回一个 Promise,然后这个 Promise 被传递给 expect(),rejects 匹配器会等待它被拒绝。

注意事项与最佳实践

理解匹配器设计: 始终查阅Jest官方文档,理解每个匹配器的设计意图和期望的输入类型。Promise vs. Function: 区分 rejects(用于 Promise)和 toThrow(用于同步函数)的用法。立即执行: 当使用 rejects 时,确保你的异步函数被立即调用,以便 expect() 接收到的是一个 Promise 对象,而不是一个未执行的函数。错误类型和消息: toThrowError 可以接收字符串(匹配错误消息)、正则表达式(匹配错误消息模式)、错误类(匹配错误类型)或错误实例(匹配错误实例和消息)。选择最能表达你测试意图的方式。

总结

在Jest中测试异步函数抛出的异常时,关键在于将异步函数调用后返回的 Promise 对象直接传递给 expect(),并结合 rejects.toThrowError() 匹配器。避免将异步函数调用包裹在另一个函数中传递给 expect(),这虽然可能在某些情况下“奏效”,但并非Jest rejects 匹配器的正确用法,可能导致测试行为的不一致或未来兼容性问题。遵循官方推荐的模式,能够确保测试的健壮性、可读性,并与Jest的设计哲学保持一致。

以上就是Jest中测试异步函数抛出异常:rejects 的正确用法解析的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1520202.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月20日 13:07:04
下一篇 2025年12月20日 13:07:16

相关推荐

  • 获取 JavaScript 列表长度的正确方法

    本文旨在帮助开发者正确获取 JavaScript 列表中元素的个数。通过分析常见的错误方法和原因,本文将提供正确的解决方案,并讨论更有效的数据传递方式,避免将数组转换为字符串再进行处理。 在 JavaScript 中,获取列表(通常指数组)的长度是一个常见的操作。然而,当从 HTML 元素(例如隐藏…

    2025年12月21日
    000
  • JavaScript:将特定格式字符串高效转换为二维数组的教程

    本教程将详细阐述如何利用javascript将形如 `[[item1, item2], [item3, item4]]` 的特定格式字符串转换为可操作的二维数组。我们将通过字符串截取、正则表达式匹配和循环迭代等技术,逐步解析复杂的字符串结构,确保数据能够被精确提取和组织,从而为后续的数据处理提供便利…

    2025年12月21日
    000
  • JavaScript中正确获取从隐藏输入获取的列表(字符串)长度

    当从HTML隐藏输入字段获取JavaScript中的“列表”时,其值通常是一个字符串表示。直接使用`.length`属性会返回字符串的字符长度,而非实际的元素数量。要正确获取列表中元素的数量,需要先将该字符串通过特定的分隔符(如逗号)拆分成一个数组,然后获取该数组的长度。本文将详细介绍这一过程及更推…

    2025年12月21日
    000
  • 使用Proxy和Reflect实现高级数据绑定

    通过Proxy和Reflect可实现数据与视图自动同步。1. Proxy用于拦截对象的读取、赋值操作,2. Reflect确保默认行为并返回正确结果,3. 在set中调用更新函数实现响应式渲染,4. 结合递归代理支持嵌套对象监听,5. 传递receiver避免代理链断裂。该机制为构建轻量级双向绑定提…

    2025年12月21日
    000
  • JavaScript 调试技巧:Chrome DevTools 高级用法

    掌握Chrome DevTools高级技巧可高效定位内存泄漏、异步问题和性能瓶颈。1. 使用条件断点和日志点避免代码污染,精准输出特定条件下的变量值而不中断执行。2. 开启异步调用栈追踪并设置事件监听器断点,完整查看Promise链或事件回调路径,快速定位错误源头。3. 将第三方库脚本设为黑盒,调试…

    2025年12月21日
    000
  • JavaScript中从HTML隐藏输入获取列表长度的正确姿势

    本文探讨了在javascript中从html隐藏输入元素获取列表长度时常见的误区。由于html输入的值始终是字符串,直接访问`length`属性会返回字符串的字符数而非实际列表项数。教程将详细解释这一现象,并提供通过字符串拆分获取正确列表长度的方法,同时强调使用更优的数据传递策略以避免此类问题。 在…

    2025年12月21日
    000
  • 使用Object.defineProperty实现响应式数据

    Object.defineProperty通过get/set拦截属性读写,实现数据响应式,Vue 2据此追踪依赖并更新视图,但无法监听数组索引及属性增删,需递归遍历对象实现深度监听。 在 JavaScript 中,Object.defineProperty 是实现数据响应式的一种核心手段,尤其在 V…

    2025年12月21日
    000
  • JavaScript 默认参数:解决函数参数未传递的问题

    默认参数允许在函数定义时为参数指定默认值,当未传参或传入undefined时生效。例如function greet(name = “游客”)会输出“你好,游客!”;支持表达式、函数调用及前参引用,常用于配置对象、可选字段等场景,提升代码健壮性与可读性。 在 JavaScrip…

    2025年12月21日
    000
  • 使用Canvas实现简单图片滤镜效果_javascript技巧

    使用JavaScript和Canvas可实现图片滤镜,通过getImageData获取像素数据并修改RGB值,再用putImageData渲染;常见滤镜包括灰度、反色和亮度调整,需注意性能与跨域问题。 在网页开发中,使用 JavaScript 结合 HTML5 的 Canvas 可以为图片添加各种简…

    2025年12月21日
    000
  • 使用JavaScript实现一个简单的MVVM框架_javascript框架

    答案:通过Proxy实现数据响应式,Compiler解析模板指令,Watcher与Dep完成依赖收集和视图更新,构建极简MVVM框架。 要实现一个简单的MVVM(Model-View-ViewModel)框架,核心是数据绑定和响应式更新视图。我们可以通过JavaScript的Object.defin…

    2025年12月21日
    000
  • JavaScript:将特定格式字符串转换为二维数组的实用方法

    本文将探讨在javascript中如何将形如`[[item1, date], [item2, date]]`的特定格式字符串转换为可操作的二维数组。我们将详细介绍利用字符串分割、正则表达式等手动解析方法,以及在字符串符合json规范时如何使用`json.parse()`进行高效转换,帮助开发者便捷地…

    2025年12月21日
    000
  • 前端水印技术的JS实现方案_javascript技巧

    答案:前端水印通过Canvas或DOM生成,用于防信息泄露,可结合用户信息动态渲染并监听删除操作,但仅作辅助防护。 前端水印技术常用于防止信息泄露或追溯数据来源,尤其在后台管理系统、数据可视化平台中应用广泛。通过 JavaScript 动态生成水印,可以有效提醒用户当前页面内容受保护,同时具备一定的…

    2025年12月21日
    000
  • JS中URL编码与解码方法详解_javascript技巧

    encodeURI用于编码完整URL,保留结构字符,适用于整个链接;encodeURIComponent更严格,编码所有特殊字符,适合参数值;两者对应各自的解码方法,避免乱码。 在JavaScript中处理URL时,经常需要对特殊字符进行编码和解码,以确保数据能正确传输。由于URL中不允许出现空格、…

    2025年12月21日
    000
  • 优化大量网络请求:分批处理、并发控制与超时策略

    本文旨在解决前端应用中处理大量网络请求时遇到的api超时、403错误等问题。通过分析常见的错误尝试,文章重点介绍了如何利用bluebird.map进行并发控制,以及如何手动实现分批处理和延迟执行请求,从而有效管理请求负载,避免api限流,确保应用稳定性和用户体验。 引言:处理大量网络请求的挑战 在现…

    2025年12月21日
    000
  • JavaScript中的数据结构实现:栈与队列

    栈和队列可通过JavaScript数组或自定义类实现。1. 栈遵循后进先出(LIFO),用push/pop操作实现高效入栈出栈;2. 队列遵循先进先出(FIFO),可用push/shift操作,但shift为O(n)影响性能;3. 可通过类封装实现peek、front、isEmpty等方法;4. 栈…

    2025年12月21日
    200
  • JavaScript 数组归并:reduce() 方法实现数组累计操作

    reduce()方法用于将数组归并为单一值,不修改原数组。常用于求和、扁平化、统计频次等场景,通过累加器逐步积累结果,需注意初始值设置对执行过程的影响。 JavaScript 中的 reduce() 方法是处理数组累计操作的核心工具。它能将数组中的所有元素从左到右“归并”为一个单一值,适用于求和、拼…

    2025年12月21日
    000
  • 使用Node.js高效批量删除MongoDB多个集合

    本教程详细指导如何通过node.js编程方式批量删除mongodb数据库中的多个集合。文章将介绍使用mongodb官方驱动程序连接数据库,并演示如何迭代预定义的集合列表,逐一执行`drop()`操作,实现高效、自动化的集合清理。内容包含完整的代码示例、操作步骤及重要注意事项,帮助开发者安全、便捷地管…

    2025年12月21日
    000
  • Django DRF与React:解决管理员创建用户不设密码时的400错误

    本教程旨在解决django rest framework后端与react前端交互时,管理员创建用户无需设置密码导致400错误的问题。文章详细解析了错误原因,并提供了通过优化drf序列化器(设置`password`为`write_only`和`required=false`)、定制`create`方法…

    2025年12月21日
    200
  • 使用JavaScript实现一个简单的AST解析器_js编译原理

    首先实现词法分析将代码转为Token,再通过递归下降解析器构建AST,正确处理运算优先级,最终生成反映表达式结构的抽象语法树。 要实现一个简单的AST(抽象语法树)解析器,我们需要从词法分析(Lexer)开始,接着进行语法分析(Parser),最终生成AST。这个过程是编译原理中的核心部分,适用于构…

    2025年12月21日
    000
  • 如何在 MongoDB 中批量删除多个集合

    本文介绍了如何在 MongoDB 中通过脚本批量删除多个集合。通过 Node.js 脚本连接 MongoDB 数据库,循环遍历需要删除的集合列表,并使用 `drop()` 方法删除每个集合,从而实现批量删除操作。 在 MongoDB 中,删除单个集合可以使用 db.collectionName.dr…

    好文分享 2025年12月21日
    000

发表回复

登录后才能评论
关注微信