前端要学的测试课 从Jest入门到TDD BDD双实战

面试时被问到「你们项目有测试吗」，答不上来；接手别人的老项目，改一行代码心里没底，只能靠手点；想把测试补起来，打开 Jest 文档看了两章，还是不知道第一个测试用例该写在哪。这门课针对的就是这类情况——不是让你成为测试专家，而是把前端测试这条线从「听说过」拉到「能在项目里用起来」。

先搞清楚你是不是真的需要它

前端测试的坑不在难，而在散。同一个「测一下」的需求，可能是单元测试、可能是组件测试、也可能是端到端集成验证，用错工具和层次，写出来的东西维护成本比不写还高。这门课的价值在于先把这层分类讲清楚：Jest 负责什么、测试替身（mock、stub、spy）各自解决什么问题、什么时候该写断言、什么时候该交给集成测试。如果你现在写测试的常态是「凭感觉加几个 expect」，问题多半出在这一层没理清。

另一种情况是团队已经在推 TDD 或 BDD，但你只是跟着流程走，不明白为什么先写测试再写实现、为什么 BDD 要用接近自然语言的描述组织用例。这两套方法论在课程里是分开落地的，不是当概念介绍，而是各自配了完整实战。

Jest 部分要练到什么程度

Jest 本身不难，难在配置和心智模型。课程从框架基础入门，覆盖的是你实际会撞上的东西：测试文件的组织与匹配、断言库的写法、异步代码怎么测（回调、Promise、async/await 三种形态处理方式完全不同）、mock 的几种粒度、快照测试适合和不适合的场景、覆盖率报告怎么看。这些点单独搜都能搜到，但拼不成一套能落地的判断标准，这门课把它们串在同一条线上。

学完这部分，你应该能回答：一个异步请求函数要怎么测才不 flaky？什么时候该 mock 掉一个模块，什么时候该放真数据？覆盖率 80% 代表什么、不代表什么？

TDD 与 BDD：两条不同的实战路线

TDD 部分走的是「红—绿—重构」的循环，重点不在写测试，而在于它倒逼你把函数职责拆小。课程里有完整的实战环节，跟着走一遍才能体会先写失败测试对设计的影响。

BDD 部分的落点更贴近真实项目，直接铺到 Vue 和 React 两个技术栈上，做组件测试与集成测试。这里要处理的是单元测试碰不到的问题：组件渲染、用户交互模拟、状态变化后的断言、多个组件协作时的验证。课程还包含 BDD 双实战的内容，把行为描述到用例执行的链路走通。学完这块，你能分清哪些场景该用单元测试兜底、哪些必须上集成测试，而不是所有东西都堆在一个文件里。

边看边动手的配套动作

• 每学完一种断言或 mock 写法，回自己项目里找一个函数改写它的测试，不要只跑课程示例。
• 挑一个你负责过的组件，先用单元测试测它的纯逻辑，再补一个集成测试测交互，体会两者边界。
• 异步测试部分建议反复练，这是前端测试里最容易写出假通过的地方。
• 快照测试不要无脑加，课上讲的不适用场景要对着自己的组件库验证一遍。

看完应该能回答的问题

如果学完还是答不上下面这几条，说明只是过了一遍，没真正吃进去：Jest 中 mock 一个模块和 mock 一个函数有什么区别？TDD 的「重构」阶段具体在动什么？BDD 的用例描述为什么强调用业务语言而不是技术语言？Vue 组件测试里，什么情况下应该断言 DOM、什么情况下应该断言组件实例？覆盖率数字之外，还有什么指标能说明测试质量？

这门课适合已经能写业务代码、但测试经验零散的前端。如果你的项目完全没测试，从 Jest 基础那部分开始起步；如果已经有零星测试，可以直接跳到 TDD 和 BDD 实战，重点补方法论和组件测试这两块。