绝大多数新项目选 Vitest，因其更轻更快、原生支持 ESM/TypeScript；Jest 适合依赖其生态的大型旧项目；关键差异在模块机制、mock 行为和调试配置。
怎么选 Jest 还是 Vitest 做 JavaScript 单元测试
绝大多数新项目直接用 Vitest 更轻、更快，尤其搭配 Vite 项目时开箱即用；Jest 适合已有大型代码库、依赖其生态（如 jest-circus 自定义 runner 或大量 ts-jest 配置）的团队。
关键差异点：
-
Vitest默认支持 ESM、顶层await和原生 TypeScript（无需额外编译），Jest默认仍走 CommonJS，需配ts-jest或babel-jest -
describe/it语法一致，但Vitest的vi.mock()行为更接近 Node.js 模块机制，而Jest的jest.mock()是静态提升的，容易在条件判断中失效 - 调试时
Vitest可直接用 VS Code 的Debug按钮启动（识别vitest.config.ts），Jest需额外配置.vscode/launch.json并指定runtimeExecutable
如何写真正可测的函数，避开常见陷阱
不是所有函数都适合单元测试——核心是「可隔离」和「可预测」。以下写法会让测试变脆弱：
- 函数内部调用
Date.now()、Math.random()、localStorage等副作用源，应提取为参数或依赖注入（例如传入clock: { now: () => number }） - 直接修改传入对象（如
obj.name = 'new'），导致测试间状态污染；改用返回新对象（{ ...obj, name: 'new' }）或明确标注mutate: true选项 - 用
setTimeout做“异步”但没返回 Promise，导致await失效；必须显式return new Promise(...)或改用Promise.resolve().then(...)
示例：错误写法 → 正确写法
立即学习“Java免费学习笔记（深入）”；
// ❌ 不可测
function fetchUser(id) {
return fetch(`/api/users/${id}`).then(r => r.json());
}
// ✅ 可测：依赖抽象化
function fetchUser(id, apiClient = fetch) {
return apiClient(`/api/users/${id}`).then(r => r.json());
}
VS Code 调试 JavaScript 测试用例的实操要点
不靠 console.log，真断点调试才能看清执行流。重点在三件事：
- 确保测试文件后缀是
.test.ts或.spec.ts（Vitest 默认识别），且未被exclude在vitest.config.ts中 - 在测试代码里打上断点（比如
expect(...).toBe(...)前一行），右键选择Debug Test（Vitest）或运行带--runInBand --no-cache的 Jest 命令 - 若断点不命中，检查是否启用了
sourceMap: true（Vite/Vitest 默认开启），并确认devtools: true在vitest.config.ts的browser或coverage配置中未被误关
常见报错：Cannot set breakpoints in file ... because it does not map to any source file —— 通常是 tsconfig.json 中 "outDir" 和 "sourceRoot" 冲突，删掉 outDir 即可（Vitest 不需要编译输出）
mock 接口请求时为什么总是 mock 失败
根本原因不是语法错，而是模块加载时机与 mock 注入顺序不匹配。典型失败场景：
- 被测模块在顶层就 import 了
axios，而vi.mock('axios')写在测试文件底部 → mock 生效前模块已初始化完成 - 用
vi.mock但没调用vi.useFakeTimers()，导致axios内部的setTimeout跳过，请求永远 pending - mock 返回值写成
mockResolvedValue({ data: {...} })，但实际代码里是response.data→ 应该 mock 成{ data: { id: 1 } }，而非只 mockdata字段
可靠写法：
import { vi, it, expect } from 'vitest';
import { getUser } from './api';
vi.mock('./api', async (importOriginal) => {
const mod = await importOriginal();
return {
...mod,
axios: {
get: vi.fn().mockResolvedValue({ data: { id: 1, name: 'Alice' } })
}
};
});
it('fetches user by id', async () => {
const user = await getUser(1);
expect(user.id).toBe(1);
});
注意：mock 必须放在 import 语句之后、测试用例之前，且不能包裹在 it 或 beforeEach 里。
