Jest因零配置、内置断言、Mock支持、快照测试和并行执行等特性成为JavaScript测试首选,安装后通过npm test即可运行测试,其核心功能包括test/describe组织用例、expect匹配器断言、异步测试、模块Mock及快照比对,并支持生命周期钩子管理测试状态。

测试驱动开发(TDD)在现代 JavaScript 开发中扮演着关键角色,而 Jest 是目前最受欢迎的单元测试框架之一。它由 Facebook 维护,开箱即用、配置简单,支持异步测试、Mock、覆盖率报告等功能,广泛应用于 React 项目,也适用于 Node.js 和普通 JavaScript 应用。
为什么选择 Jest?
Jest 能快速上手,主要得益于以下几个特点:
- 零配置启动:安装后无需复杂配置即可运行测试。
- 内置断言库和测试工具:无需额外引入 Chai 或 Mocha 等工具。
- 支持快照测试:特别适合 UI 组件测试,能记录输出结构并比对变化。
- 优秀的 Mock 支持:可轻松模拟函数、模块、定时器等。
- 并行执行测试:提升大型项目测试速度。
- 代码覆盖率报告:通过命令行一键生成。
快速开始:安装与基本使用
初始化项目并安装 Jest:
npm init -y npm install --save-dev jest
在 package.json 中添加测试脚本:
立即学习“Java免费学习笔记(深入)”;
"scripts": {
"test": "jest"
}
编写一个简单的函数进行测试:
// math.js
function add(a, b) {
return a + b;
}
module.exports = { add };
创建对应的测试文件:
// math.test.js
const { add } = require('./math');
test('adds 1 + 2 to equal 3', () => {
expect(add(1, 2)).toBe(3);
});
运行 npm test,Jest 会自动查找以 .test.js 或 .spec.js 结尾的文件并执行。
核心功能详解
Jest 提供了丰富的 API 来满足不同测试需求。
1. 测试组织:test、describe使用 test() 定义单个测试用例,用 describe() 分组相关测试:
describe('Math operations', () => {
test('addition works', () => {
expect(add(1, 2)).toBe(3);
});
test('addition with negatives', () => {
expect(add(-1, -1)).toBe(-2);
});
});
2. 常用断言:expect 与匹配器
Jest 使用 expect 配合匹配器进行断言:
- .toBe():严格相等(===)
- .toEqual():深度比较对象或数组
- .toBeDefined() / .toBeNull()
- .toContain():检查数组是否包含某元素
- .toThrow():验证函数是否抛出异常
测试 Promise 或 async/await 函数时,需返回 Promise 或使用 async:
// asyncFunc.js
function fetchData() {
return Promise.resolve('data');
}
// asyncFunc.test.js
test('fetches data asynchronously', async () => {
const data = await fetchData();
expect(data).toBe('data');
});
4. Mock 函数与模块
Mock 可替代真实实现,控制行为并验证调用:
const mockFn = jest.fn(() => 'mocked value');
mockFn('input');
expect(mockFn).toHaveBeenCalledWith('input');
expect(mockFn()).toBe('mocked value');
模拟模块导入:
// utils.js
export const fetchUser = () => axios.get('/user');
// user.test.js
jest.mock('axios');
import axios from 'axios';
import { fetchUser } from './utils';
test('fetchUser calls axios.get', async () => {
axios.get.mockResolvedValue({ data: 'fake user' });
const user = await fetchUser();
expect(axios.get).toHaveBeenCalledWith('/user');
});
5. 快照测试
用于检测输出是否意外改变:
test('renders correctly', () => {
const component = renderComponent();
expect(component).toMatchSnapshot();
});
首次运行生成快照文件,后续测试将比对结果。若变更合理,可通过交互命令更新快照。
测试生命周期与钩子函数
Jest 提供钩子函数管理测试前后的状态:
- beforeEach():每个测试前执行
- afterEach():每个测试后执行
- beforeAll():所有测试前执行一次
- afterAll():所有测试后执行一次
例如重置 Mock 状态:
beforeEach(() => {
jest.clearAllMocks();
});
基本上就这些。Jest 的设计让测试变得直观高效,配合 ESLint、Babel、TypeScript 等生态也能无缝集成。掌握其核心功能后,就能为项目构建可靠的测试保障。











