Jest 中如何测试异步代码？
在前端开发中，异步代码是非常常见的。测试异步代码需要使用特殊的工具和技术来确保测试的准确性。Jest 是一个出色的测试工具，它提供了许多有用的测试功能，使得测试异步代码变得简单易行。本文将介绍在 Jest 中测试异步代码的方法。
分别介绍以下内容：
一、异步代码的测试
二、使用回调测试异步代码
三、使用 Promises 测试异步代码
四、使用 async/await 测试异步代码
五、总结
一、异步代码的测试
异步代码通常是使用回调函数、Promise 或 async/await 实现的。Jest 通过使用“Done”回调函数来测试异步代码。
- 回调函数：回调函数可以是任何函数，它们在异步函数的结果返回时被调用。Jest 用这个函数来检查异步函数的结果。
- Promises：它是异步编程的一种方案，比回调函数更加优雅，可以解决回调函数会出现的“回调地狱”的问题。
- async/await：它是一个可以使异步代码看起来像同步代码的语法糖。
下面我们将学习使用 Jest 测试各种异步场景的代码。
二、使用回调测试异步代码
我们来看一个使用回调函数实现的异步代码：
function fetchData(callback) {
setTimeout(() => {
callback("user data");
}, 1000);
}该函数会在 1 秒后返回用户数据，我们在其内部使用 setTimeout 模拟异步延迟。
回调函数的测试基本类似于其他的 Jest 测试，但是需要在回调函数中调用“done”函数。done 函数的目的是通知 Jest 这个测试已经结束，才能进行下一步测试。
我们来编写一个测试用例：
test("fetchData returns user data", (done) => {
function callback(data) {
expect(data).toBe("user data");
done();
}
fetchData(callback);
});注意：在回调函数中要调用 done，通知 Jest 这个测试已经结束。
这个测试用例中提供的回调函数使用 Jest 的 expect 函数来判断返回数据是否符合预期，并使用 done 函数来告诉 Jest 这个测试已经完成。
三、使用 Promises 测试异步代码
我们来看一个使用 Promise 实现的异步代码：
function fetchData() {
return new Promise((resolve) => {
setTimeout(() => {
resolve("user data");
}, 1000);
});
}这个函数返回一个 Promise，它会在 1 秒后返回用户数据。
Promises 的测试在 Jest 中有一些不同之处。我们需要返回 Promise，然后在在 then 方法中执行测试。如果 Promise 被拒绝，则需要捕获错误并通知 Jest。
我们来编写一个测试用例：
test("fetchData returns user data", () => {
expect.assertions(1);
return fetchData().then((data) => {
expect(data).toBe("user data");
});
});这里我们使用了 expect.assertions 来确保测试用例中至少有一次断言。
四、使用 async/await 测试异步代码
我们来看一个使用 async/await 实现的异步代码：
function fetchData() {
return new Promise((resolve) => {
setTimeout(() => {
resolve("user data");
}, 1000);
});
}该函数返回一个 Promise，它在 1 秒后返回用户数据。接下来，我们将使用 async/await 来测试该函数。
我们来编写一个测试用例：
test("fetchData returns user data", async () => {
expect.assertions(1);
const data = await fetchData();
expect(data).toBe("user data");
});注意：我们需要在测试用例声明的函数前加上 async，告诉 Jest 这个测试需要等待异步结果。
这个测试用例使用带有 expect.assertions 的 await 函数来检查该异步函数是否正确。在这里，我们检查返回结果是否符合预期。
五、总结
Jest 是一个出色的前端测试工具，并提供了许多有用的测试功能，使得异步代码的测试变得更加简单可行。
在本文中，我们介绍了异步代码的三种不同方式，并在 Jest 中展示了如何测试这些不同类型的异步代码。这些方法可以帮助您更好地测试和确保您的异步代码的正确性。
总之，Jest 是非常强大的测试工具，无论您的代码是同步还是异步，都可以使用它进行测试，并确保代码的正确性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64551a30968c7c53b08c3e7b