最近研究了下jasmine框架，收益頗豐?；诠疽晃煌碌奈臋n，我這里列舉下jasmine框架的一些特征。

成都創(chuàng)新互聯(lián)公司專注于三明網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供三明營銷型網(wǎng)站建設(shè)，三明網(wǎng)站制作、三明網(wǎng)頁設(shè)計、三明網(wǎng)站官網(wǎng)定制、小程序定制開發(fā)服務(wù)，打造三明網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供三明網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

一：介紹

Jasmine框架是一個行為驅(qū)動的開發(fā)框架，用于測試javascript代碼，它不會依賴于任何其他的javascript框架，也不需要一個DOM，并且它有非常簡單和清晰的語法。

二：適用范圍

因為Jasmine框架不依賴瀏覽器，DOM，或者任何javascript框架，所以它特別適合單元測試網(wǎng)站，Node.js項目或者任何有javascript運行的項目。

小例子1：比如要測試是否真實值比期望值小

beforeEach(function() { 
  this.addMatchers({ 
 
    toBeLessThan: function(expected) { 
      var actual = this.actual; 
      var notText = this.isNot ? " not" : ""; 
 
      this.message = function () { 
        return "Expected " + actual + notText + " to be less than " + expected; 
      } 
 
      return actual < expected; 
    } 
 
  }); 
}); 

小例子2: 比如要測試Ajax或者其他異步的行為：

var Klass = function () { 
}; 
 
Klass.asyncMethod = function (callback) { 
  someAsyncCall(callback); 
}; 
 
... 
 
it('should test async call', function () { 
  spyOn(Klass, 'asyncMethod'); 
  var callback = jasmine.createSpy(); 
 
  Klass.asyncMethod(callback); 
  expect(callback).not.toHaveBeenCalled(); 
 
  var someResponseData = 'foo'; 
  Klass.asyncMethod.mostRecentCall.args[0](someResponseData); 
  expect(callback).toHaveBeenCalledWith(someResponseData); 
 
}); 

三:我們?yōu)槭裁催x擇Jasmine框架？

雖然在市面上有許多種類的js單元測試框架，比如TestSwarm, JsTestDriver,Buster.js,YUI Yeti,Sinon等，但是很多單元測試框架只支持和瀏覽器協(xié)同工作，有些單元測試框架無法支持異步回調(diào)代碼的測試。有些代碼，對于IDE很難理解，然而，Jasmine框架則是集各種框架優(yōu)點于一身的好框架。

四：Jasmine框架的優(yōu)秀設(shè)計原則：

(1)好的js單元測試框架不應(yīng)該聯(lián)合到任何瀏覽器，框架，平臺或者宿主機(jī)器的語言設(shè)置。

(2)好的js單元測試框架應(yīng)該有符合js語言習(xí)慣的語法。

(3)好的js單元測試框架應(yīng)該在任何js可以運行的地方運行

(4)好的js單元測試框架應(yīng)該對于被測試的應(yīng)用是非侵入式的。

(5)好的js單元測試框架應(yīng)該能和IDE很好融合，比如可以通過IDE的靜態(tài)代碼質(zhì)量檢查。

(6)好的js單元測試框架應(yīng)該足夠簡單，并且容易上手。(這一點我深有體會，我看5分鐘就學(xué)會了，然后寫了第一個demo并且跑通了）

五:實踐

這里給出一個我前幾天實踐的例子，我利用jasmine來測試ext-js的代碼：

首先我們要建立單元測試的目錄結(jié)構(gòu)，基于建立在test目錄之下，我們共需要2個目錄和一個文件。

目錄1: lib ---這個目錄是存放jasmine框架本身的代碼

目錄2: spec---這個目錄是存放所有的單元測試代碼

SpecRunner.html--這個文件用于配置整個jasmine單元測試框架，因為我們最簡單的應(yīng)用只要把測試結(jié)果輸出到控制臺上，所以我們這里只配置了ConsoleReporter.

SpecRunner.html的代碼如下：

 
  "http://www.w3.org/TR/html4/loose.dtd"> 
 
 
 
   
 
   
 
   
 
   
 
   
 
  
 
   
 
   
 
   
 
  
 
   
 
   
 
 
   
 
  
   
 
 
  (function() { 
 
      var jasminejasmineEnv = jasmine.getEnv(); 
      jasmineEnv.updateInterval = 1000; 
      var htmlReporter = new jasmine.HtmlReporter(); 
      jasmineEnv.addReporter(htmlReporter); 
      jasmineEnv.specFilter = function(spec) { 
        return htmlReporter.specFilter(spec); 
      }; 
 
      var currentWindowOnload = window.onload; 
 
      window.onload = function() { 
        if (currentWindowOnload) { 
          currentWindowOnload(); 
        } 
        execJasmine(); 
      }; 
  
      function execJasmine() { 
        jasmineEnv.execute(); 
 
      }
 
    })(); 
 

 
   
 
 
 

從這段代碼我們不難看出，13-15行引入了jasmine框架，23行引入了ext-js庫，因為我們要測試ext-js代碼，29行是需要被我們測試的代碼，34行是單元測試代碼，也就是我們寫的測試用例，第40-59行則是創(chuàng)建一個HTMLReporter用于顯示，并且啟動jasmine框架。

我們寫了一個很簡單的測試用例，它用來判定ext-js庫的一些基本信息：

/** 
 
* This file is used for verifying the project foundation 
 
*/ 
 
 
describe("Ext-js Basic Information", function() { 
 
 
         //test whether ext-js has been loaded 
 
    it(" Ext-js has been loaded", function() { 
 
        expect(Ext).toBeDefined(); 
 
         
 
    }); 
 
     
 
    //test whether ext-js major version is 4 
 
    it(" Ext-js has version ,and major version is 4" ,function(){ 
 
         expect(Ext.getVersion()).toBeTruthy(); 
 
        expect(Ext.getVersion().major).toEqual(4); 
 
    }); 
 
}); 
 
  

最終測試的結(jié)果，就是在瀏覽器上顯示了測試報告，綠條告訴我們測試用例都通過了：