Jest是一个广泛使用的 JavaScript 测试框架，它提供了Mock功能，使测试前端应用程序变得更简单高效。Mock在测试中扮演着重要的角色，它可以帮助我们模拟其他模块的行为，从而使我们更容易测试我们的代码逻辑是否正确，也可以避免测试因为外部模块发生的变化而失败。
本篇文章将讲解Jest Mock的基本概念、使用方法，以及如何模拟其他模块的行为，帮助您更好地理解Jest Mock。
Jest Mock基本概念
- Mock对象
Mock对象是模拟某个模块对象的行为，并在测试中使用。Mock对象提供与模块对象相似的接口, 我们可以在测试中使用Mock对象, 而不必担心对原始模块对象的影响。
- Jest.fn()
Jest.fn()是Jest提供的一个核心函数，它可以创建一个新的mock函数。Jest.fn()返回一个新的mock函数，它捕获函数调用时的一些信息（参数，返回值等），这些信息可以在测试中进行验证或调用。
- Mock Implementation
Mock Implementation是Mock对象的一个属性，它定义Mock对象的行为和返回值。为了创建Mock Implementation，我们需要使用Jest.fn()函数，它可以创建一个mock函数并指定其行为和返回值。
- Mocking Modules
Mocking Modules是Jest提供的一个mock功能，它允许我们在测试中使用自定义的Mock对象替换实际的模块对象。当我们Mock一个模块时，Jest会覆盖原始的实现，并使用我们提供的Mock Implementation。这种方法非常有用，可以在测试中隔离需要测试的部分，避免其他不必要的测试干扰。
Jest Mock 使用方法
Mock函数
在使用Jest.fn()的时候，可以指定它的一些行为与返回值。例如，我们可以使用Jest.fn()来模拟一个返回3的函数。
test('假设一个返回3的函数', () => {
const mockFn = jest.fn(() => 3);
expect(mockFn()).toBe(3);
});这个test用Jest.fn()来模拟一个返回值为3的函数，它的输出结果应该为3。Jest.fn()函数也经常被用来进行输入参数和返回值的验证。例如：
-- -------------------- ---- ------- -- ------------ ------------------ -- -- - ----- ------ - ---------- --------------------- ---------------------------------------- --- -- -------------- ---------------------- -- -- - ----- ------ - ---------- -- --- ------------------------------------- ---
Mock Modules
模块模拟(Mocking modules)是使用jest.mock()函数来实现。在测试文件中，我们可以使用jest.mock()来指定被测试的模块，并提供自定义的Mock Implementation。例如：
-- -------------------- ---- -------
------------------------- -- -- --
--------- ---------------------------- ----- ----- ---------
----
------------ ---------- ---- -- -- -
----------------- -- -- -
----- ----- - -----------
------------------------ ----- ----- ----- ----
---
---在这个示例中，我们使用jest.mock()函数将db模块Mock，并为getUsers()函数添加Mock Implementation。在测试中，我们期望getUsers()函数返回Mock Implementation中定义的自定义值。通过这种方式，我们可以隔离测试的逻辑，并确保我们只测试我们所需的部分。
模拟API请求
在前端开发中，我们通常涉及到API请求。在单元测试过程中，我们通常不希望真正的请求发送到服务器上，因为这样会增加测试成本。因此，我们可以使用Jest Mock来模拟API请求。
例如，我们可以使用Mock Implementation来模拟API请求，并验证我们的应用程序是否正确处理了请求的结果。
-- -------------------- ---- -------
------ - -------- - ---- --------
-------------------
-------------------- -- -- -
--------------- ----- -- -- -
----- -------- - -- ----- ----- ----- ---
-----------------------------------------
----- ----- - ----- -----------
------------------------ ----- ----- ----- ----
---
---在这个示例中，我们使用_mockResolvedValueOnce()方法来定义Mock Implementation，它会立即返回一个指定值。最后，我们在测试中使用await来等待真正的API响应并验证结果是否正确。
总结
在Jest Mock中，Mock对象是非常重要的实现方式。我们可以使用Jest.fn函数来创建Mock对象，并为其定义自定行为和返回值。Jest mock功能非常灵活，它允许我们在测试中使用自定义的Mock对象代替实际的模块对象。我们还演示了如何使用Jest Mock来模拟API请求，并验证我们的应用程序是否正确处理了请求的结果。Jest Mock的深度学习和指导能够帮助您写出更高质量、可靠的前端应用程序和测试代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a03c3d48841e9894c942ff