浅谈一下前端单元测试

关于单元测试这个概念，我想很多前端的小伙伴都知道，但是却并不一定能描述清楚。由于我开始接触单元测试还是在四个月前，当时也只是做了一些纯函数的单元测试。所以在这里只能说浅谈一下前端单元测试。

什么是单元测试？

我理解的单元测试就是用于测试一个模块能否到达预期效果。通过代码来定义一个可用的衡量标准，并且可以快速检验。

为什么要做单元测试？

随着前端的快速发展，各类框架层出不穷，前端实现的业务逻辑也越来越复杂，这时单元测试的作用就凸显出来了。其实目前为止还是有很多代码是缺少单测的，只是现在单测的重视程度越来越高了而已。单测的好处不言而喻，首先可以提高代码的正确性，在上线前做到心里有底。其次当代码需要重构时，有测试用例做后盾，就可以大胆进行重构。然后从学习曲线来看，单元测试比较容易上手，覆盖的范围比较全面。

测试框架

目前的测试框架很多，今天咱们单拎出来Jest来说一下。

Jest是Facebook出品的通用测试框架

一个好用的JavaScript测试框架，开箱即用，无需配置 。

适用但不局限于使用以下技术的项目：Babel,Typescript,Node,React,Angular,Vue

整个工具放在一个地方，好书写好维护，非常方便

开始使用

• 安装Jest

yarn add --dev jest 或npn install --save-dev jest

• 配置package.json

• 测试用例           

• 运行结果

npm run test 开始运行，得到测试结果

当然这并不是上面例子的测试结果，只是找了张图片来给大家看一下测试结果是什么样子的。

单测的质量很重要，覆盖率一定程度上客观反应了单测的质量。

​

拓展

这一期我们只是浅谈了一下前端的单元测试和Jeat，而且我们是在node里做测试，如果要在浏览器里做单测应该怎么办，这里就需要去更加深入了解关于Ui Jest的知识了。