从零开始使用 Jest 进行 JavaScript 单元测试-JavaScript中文网-JavaScript教程资源分享门户

前言

在前端开发中，我们经常需要编写 JavaScript 代码来实现各种功能。为了确保代码质量和稳定性，我们需要进行单元测试。Jest 是一个流行的 JavaScript 测试框架，它提供了丰富的 API 和友好的使用体验，可以帮助我们轻松地编写和运行单元测试。本文将介绍如何从零开始使用 Jest 进行 JavaScript 单元测试。

安装 Jest

首先，我们需要安装 Jest。可以使用 npm 或 yarn 安装 Jest：

npm install --save-dev jest

或

yarn add --dev jest

安装完成后，我们就可以开始编写单元测试了。

编写单元测试

在编写单元测试之前，我们需要明确什么是单元测试。单元测试是指对软件中的最小可测试单元进行检查和验证，以确保它们的行为符合预期。在 JavaScript 中，最小可测试单元通常是函数。因此，我们需要编写测试用例来测试函数的行为。

下面是一个简单的 JavaScript 函数：

function sum(a, b) {
  return a + b;
}

我们可以编写一个测试用例来测试这个函数：

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

这个测试用例使用 Jest 提供的 test 函数来定义，它接受两个参数：一个字符串描述和一个函数。函数中包含我们要测试的代码，并使用 expect 函数来断言函数的输出是否符合预期。

在这个测试用例中，我们断言 sum(1, 2) 的输出结果应该是 3。如果测试通过，Jest 将会输出一个绿色的提示信息，否则将会输出一个红色的错误信息。

运行单元测试

我们已经编写了一个简单的测试用例，现在需要运行它。可以使用以下命令运行 Jest：

npx jest

或

yarn jest

Jest 将会扫描项目中所有的测试文件，并执行所有的测试用例。如果测试用例全部通过，Jest 将会输出一个绿色的提示信息，否则将会输出一个红色的错误信息。

更多的测试用例

上面的测试用例只是一个简单的例子，实际上我们需要编写更多的测试用例来覆盖代码中的各种情况。以下是一些常见的测试用例：

异步代码

如果我们的代码中包含异步操作，我们需要编写异步测试用例。以下是一个简单的异步测试用例：

test('the data is peanut butter', () => {
  expect.assertions(1);
  return fetchData().then(data => {
    expect(data).toBe('peanut butter');
  });
});

该测试用例使用 fetchData 函数获取数据，并使用 expect 函数来断言数据是否符合预期。需要注意的是，我们需要使用 expect.assertions 函数来确保在异步测试中至少进行一次断言。

抛出异常

如果我们的代码中可能会抛出异常，我们需要编写测试用例来测试这种情况。以下是一个简单的抛出异常测试用例：

test('throw error', () => {
  expect(() => {
    throw new Error('error');
  }).toThrow('error');
});

该测试用例使用 expect 函数来断言函数是否抛出了一个指定的异常。

Mock 函数

如果我们的代码中包含依赖其他模块的函数调用，我们需要编写 Mock 函数来模拟这些调用。以下是一个简单的 Mock 函数测试用例：

// javascriptcn.com 代码示例
const mockCallback = jest.fn(x => 42 + x);
forEach([0, 1], mockCallback);

test('mock function', () => {
  expect(mockCallback.mock.calls.length).toBe(2);
  expect(mockCallback.mock.calls[0][0]).toBe(0);
  expect(mockCallback.mock.calls[1][0]).toBe(1);
  expect(mockCallback.mock.results[0].value).toBe(42);
});

该测试用例使用 jest.fn 函数创建一个 Mock 函数，并使用 forEach 函数来调用它。我们可以通过 mock.calls 和 mock.results 属性来检查 Mock 函数的调用情况和返回值。

总结

本文介绍了如何从零开始使用 Jest 进行 JavaScript 单元测试。我们学习了如何安装 Jest、编写测试用例、运行测试用例以及编写更多的测试用例。希望本文能够帮助你更好地理解 Jest，并在实际项目中使用它来提高代码质量和稳定性。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/655c5e28d2f5e1655d677ffc