在写单测前，我们总是带着疑问和抗拒，写单测既会消耗我们的开发时间，拖慢项目进度，又要耗费精力去思考单测内容，对于未接触过的同学来说，甚至还要去学习单测的语法，那为什么我们要去写单测呢？
1.单测会有效的减低bug率，或许大家会想：不就改个 Bug，改几行而已。 可是大家有没有想过在跟测的过程中，很可能你已经开始另一个需求的评审了！ 此时的你在解决突然插入的 Bug 的时候，会拖下一个需求的时间，影响大伙打工的心态。
此时一位背锅的倒霉蛋冉冉升起，而单测的独立性给了倒霉蛋自测后的底气，要问怎么给？写写就知道啦。
3.对于自身代码的理解性，完成需求时，总有段时间疾键盘如飞，也有段时间抓耳挠腮，打开一排度娘苦苦查询无果，好不容易怼出效果却不能充分理解其中精髓，上线后复盘？不，后面的需求已经堆成山了，那么少年想成为高手，写个自测吧，用mock加以苦练，融会贯通，修成正果。
此时一位老者徐徐走来，大手一挥，《Jest》，《Mocha》，《Tape》，少年需要哪本~
聪明的小伙伴已经选择了JEST
为什么要用JEST
1.比较新
2.基础好
3.速度快
4.API简单
5.隔离性好
6.IDE整合（vscode）
7.多项目运行
8.覆盖率可视化
来不及解释了，上车
怎么用
初始化配置
执行命令
npm --init
npm install jest
下载jest（@24.8.0基本稳定）时直接默认所有选项，将得到配置文件,在配置好jest.config.js的coverageDirectory（覆盖率文件）项以及package.json文件的运行命令后，我们就可以开始jest入门了
//package.json
"scripts": {
"test": "jest"
},
人生第一个jest
1.首先我们创建一个js文件honglanman.js并暴露出两个函数（暂时使用commonJs模块规范，若要使用es6模块规范得配置babel）
function dabaojian1(val){
if(val>200){
return '至尊会员'
}else{
return '普通会员'
}
}
function dabaojian2(val){
if(val>1000){
return '双人服务'
}else{
return '单人服务'
}
}
module.exports ={dabaojian1,dabaojian2}
2.建立一个对应的测试文件honglanman.test.js
const dabaojian = require('./honglanman.js')
let{ dabaojian1,dabaojian2} = dabaojian
test('保健1-100',()=>{
expect(dabaojian1(100)).toBe('至尊会员')
})
//test('对于该条测试的描述'，（）=>{
// 期待(执行函数).匹配（'结果'）
// })
test('保健2-10000',()=>{
expect(dabaojian2(10000)).toBe('双人服务')
})
3.运行我们的测试文件
npm run test
4.读取测试结果
> jest
FAIL ./honglanman.test.js
✕ 保健1-100 (6ms) //保健1失败
✓ 保健2-10000 //保健2通过
● 保健1-100
expect(received).toBe(expected) // Object.is equality
Expected: "至尊会员" //期待得到至尊会员待遇
Received: "普通会员" //实际得到普通会员待遇
4 |
5 | test('保健1-100',()=>{
> 6 | expect(dabaojian1(100)).toBe('至尊会员')
| ^
7 | })
8 | //test('对于该条测试的描述'，（）=>{
9 | // 期待(执行函数).匹配（'结果'）
at Object.<anonymous> (honglanman.test.js:6:27)
console.log honglanman.test.js:3
{
dabaojian1: [Function: dabaojian1],
dabaojian2: [Function: dabaojian2]
}
Test Suites: 1 failed, 1 total
Tests: 1 failed, 1 passed, 2 total
Snapshots: 0 total
Time: 0.956s
此时我们只需要修改honglanman.js的会员价格，让100也能享受至尊会员的待遇
function dabaojian1(val){
if(val>99){
return '至尊会员'
}else{
return '普通会员'
}
}
function dabaojian2(val){
if(val>1000){
return '双人服务'
}else{
return '单人服务'
}
}
module.exports ={dabaojian1,dabaojian2}
再次执行得到结果
> jest
PASS ./honglanman.test.js
✓ 保健1-100 (2ms)
✓ 保健2-10000
console.log honglanman.test.js:3
{
dabaojian1: [Function: dabaojian1],
dabaojian2: [Function: dabaojian2]
}
Test Suites: 1 passed, 1 total
Tests: 2 passed, 2 total
Snapshots: 0 total
Time: 0.874s, estimated 1s
Ran all test suites.
测试通过
5.查看覆盖率
之前我们在jest.comfig.js内部配置的项作用来了
coverageDirectory: 'coverage', //设置覆盖率报表文件和获取命令
运行覆盖率报表命令
npx jest --coverage
生成覆盖率报表文件夹coverage，内部的index.html文件我们可以直接可视化了，我们依次可以直观的了解的数据有覆盖率，分支覆盖率，测试函数量，代码行的覆盖率
至此我们的第一个测试流程完结撒花~
回顾我们的第一个流程，有两个点未解决：
1.兼容es6写法
2.自动运行jest，避免每次修改完代码后都需要npm run
1,兼容es6我们可以通过配置babel解决，下载我们的babel的两个包
npm install @babel/core@7.4.5 @babel/preset-env@7.4.5
然后在跟目录下配置我们的.babelrc文件
{
"presets":[
[
"@babel/preset-env",{
"target":{
"node":"current"
}
}
]
]
}
此时我们就可以使用我们的es6模板规范了
2.自动运行jest，我们只需要在pack.json中设置命令修改成
"scripts": {
"test": "jest --watch"
},
即可完成监听了，即刻试试吧~
