探知JS測試(1)

有必定水平的js童鞋，應該會常常看到一些書上，在介紹項目的時候，會不禁自主說道測試。 好比，單元測試，函數測試，或是TDD,BDD等測試模式。
沒錯，這也是咱們須要進行掌握的。 固然，若是你的項目僅僅是寫的幾個demo，而去寫測試的話，這樣會有點浪費時間，可是本人很是鼓勵這樣作，由於你在測試時，會發現本身的代碼覆蓋率，在經本身重構的時候一點一點的變好。 這感受是很是不同的。並且在大項目中，使用測試，無疑是產品和你撕逼是，你用來堵住他嘴的最佳手段。

單元測試

這是測試類型的一種，所謂的單元即，由一些函數組成能完成某項功能的模塊。單元測試的目的就是保證你寫的模塊可以完成必定任務而且不出現bug. 另外，單元測試，也是單一職責原則的一個具體體現，若是在你的代碼測試過程當中，須要require多個模塊時，這說明你測試的主體模塊的耦合性比較高，這也是提醒你進行重構的flag。

單元測試的過程

1. 想好測試用例

2. 動手寫測試

3. 查看測試結果，經過則Pass,不然應該進行repeat

測試模式

想說一下，測試模式和單元測試的區別。
測試模式->(包括)單元測試.
一般測試模式有BDD和TDD模式。

TDD

TDD全稱爲Test-driven development即，測試驅動開發. 這個能夠算是自主測試，用來幫助你寫出好代碼的一個很是好的辦法。 也是上文說到的，當本身看到本身的代碼覆蓋率愈來愈高的時候，內心應該是滿滿的自豪感。
一般的測試步驟應該是:

1. 先寫測試

2. 再寫代碼

3. 測試

4. 重構

5. 經過
   而在大部分公司裏面，一般使用的是BDD測試。這裏先對BDD進行講解，後面會將TDD進行探索。

BDD

一樣BDD的全稱爲: Behavior-Driven development。 樸素的說法叫作行爲驅動開發。 BDD的應用場景就是給一些QA工程師使用的，他用他的語言和你進行交流，即他會進行一些測試用例，而後若是經過則說明，他已經信賴你了。
一般BDD測試提供了幾個方法:

1. describe() {alias: behavior()}

2. it()

3. before()

4. after()

5. beforeEach()

6. afterEach()
   經過上面幾個方法，說一下BDD測試應該瞭解哪些基本概念.

測試套件
在TDD裏面是指的是test suit. 在BDD裏面就對應describe()，用來對軟件某個方面的描述。
不懂吧~
針對於describe咱們具體來講一下吧。 describe接受兩個參數, 一個是字符串，另一個是函數。

describe('Action',function(){
    //...
})

那第一個字符串是開發者本身寫，那麼該怎麼寫呢？
很簡單，咱們須要明白，咱們是要給一個測試套件命名。 即，給一篇文章寫一個title同樣簡單。
好比，個人一個測試套件是想測試一個計數框架的一些功能。
那咱們的describe就能夠寫爲Counter(或者"計數",一些你本身以爲合適的title),像這樣:

describe('Counter',function(){
    it('it should increase',function(){
        //...
    })
    it('it should decrease',function(){
        //...
    })
})

那麼，咱們起好標題以後，該幹什麼呢？
首先，該空兩格~
接着，就應該開始使用測試用例來寫文章的body了。
測試用例
it就是測試用例的weapon, 它和describe類似，接受兩個參數。 第一個是對測試的描述，第二個就是具體實現。

describe('Counter',function(){
    it('it should increase',function(){
        //...
    })
})

一樣,it裏面的內容該怎麼寫呢？
我想這不是個人任務，你能夠去問下你的語文老師（或者英語老師）.
其實，你是用describe和it就已經能夠寫出一篇好文章了。惟一欠缺的就是須要在裏面填上一些內容。這時候就須要使用到斷言庫來幫你造句了。
市面上流行的斷言庫有3個，分別是assert,expect,should. 若是學過nodeJS的童鞋應該知道NodeJS自帶assert斷言庫。可是對於本人而言，以爲expect比起assert那種傻逼的寫法，看起來仍是蠻舒服了。(固然，should也有人使用，關鍵看你的性趣了).
先show show 這3個的風格吧。
好比判斷相等的寫法:

//assert
assert.equal(cal.result,1);
//expect
expect(cal.result).to.equal(1);
//should
cal.result.shoulde.equal(1)

接下來就看本身的喜愛挑一種吧。
ok~
還記得BDD提供幾個API嗎？ 沒錯，還有before,after,beforeEach,afterEach他們分別是幹什麼用的呢？
我這裏就應用，官方mocha的demo.

describe('hooks', function() {

  before(function() {
    // runs before all tests in this block
  });

  after(function() {
    // runs after all tests in this block
  });

  beforeEach(function() {
    // runs before each test in this block
  });

  afterEach(function() {
    // runs after each test in this block
  });

  // test cases
});

按照摸cha的說法，上面說的這些函數都是hook. 將測試的狀態點暴露給你，讓你能夠進行相關的操做。 一樣，官方摸cha也舉例說明了他們的用途。 好比在數據庫打開的時候，就可使用beforeEach來進行更新。

beforeEach(function(done) {
    db.clear(function(err) {
      if (err) return done(err);
      db.save([tobi, loki, jane], done);
    });
  });

要記住，beforeEach會在當前的Block下的全部case以前執行，無論你嵌套多少層。
上面的理論鋪墊完了，咱們要正式進入，測試的節奏.

mocha框架

首先，咱們運行的一切測試，都須要有一個環境支持，那麼mocha就是你的環境。 它應該算是前端測試super 流行的一個框架吧(固然，還有jasmine,zuul等). 由於內容豐富，顯示界面友好，因此，用戶也是不少的。
下載mocha環境:

sude npm install -g mocha

這裏執行全局下載。由於，測試環境在全局都是有效的，因此這裏就直接放在global下了.
配置assertion
這裏咱們就使用chai就over了，他包括了3種語言風格，你本身引用就能夠了。

sudo npm install -g chai

OK。接下來，先寫一個hello world 示例吧。
咱們按上述步驟一步一步來.

//本身測試的代碼
var Cal = (function(){
    var num = {
        base:0
    };
    var add = function(){
        num.base++;
        return num.base;
    }
    var desc = function(){
        --num.base;
        return num.base;
    }
    return {
        add,desc,num
    }
})();
//ok,如今引用斷言庫chai
var expect = require('chai').expect;
//寫出測試
describe('Counter',function(){
    it('it should increase',function(){
        expect(Cal.num.base).to.below(Cal.add());
    })
    it('it should decrease',function(){
        expect(Cal.num.base).to.above(Cal.desc());
    })
})

ok,如今能夠打開控制檯，切換到你測試文件所在的目錄，好比，個人是在 demo/demo.js
在控制檯輸入命令

mocha demo.js

若是你的屏幕出現以下:(僅限MAC用戶)
說明你的virgin測試已經完成了。今天就到這吧，總體的介紹了BDD的測試，斷言庫，測試框架，後續會深刻介紹斷言庫和測試框架。ending~