js工具之QUnit

　　QUnit是由jQuery团队开发的一套单元测试工具。官网网址：http://qunitjs.com/。

　　用法：1 我们可以直接下载qunit然后在你的HTML文件中引入js资源以及css样式资源

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>QUnit Example</title>
  <!--<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.23.0.css">-->
  <link rel="stylesheet" type="text/css" href="css/QUnit.css"/>
</head>
<body>
    <div id="qunit"></div>
  <div id="qunit-fixture"></div>
  <!--<script src="https://code.jquery.com/qunit/qunit-1.23.0.js"></script>-->
  <script src="js/QUnit.js" type="text/javascript" charset="utf-8"></script>
  
  <script type="text/javascript">
      function demo(num){
        return num>5 ? true :false;
    }
    
    
    QUnit.test( "Hello test", function( assert ) {
      assert.ok( demo(6), "大于5!" );
    });
    
    
    QUnit.test( "test2", function( assert ) {
      assert.equal( "djl 箫氏" ,"djl 箫氏", "true和1值相等" );
    });
    
  </script>
</body>
</html>

　　2 当然也可以使用CDN静态资源，上述代码中屏蔽的部分。

　　然后既可以开始了，使用最多的就是ok 断言，用来判断是true还是false；

上面代码中demo函数中的值为6大于5会返回true，所以出现的效果如上图。如果我们改为4，则会是下面的结果。

　　当然还有其他情况也会，是上图的现象，例如下面的情况。

QUnit.test( "ok test", function( assert ) {
  assert.ok( true, "true succeeds" );
  assert.ok( "non-empty", "non-empty string succeeds" );
 
  assert.ok( false, "false fails" );
  assert.ok( 0, "0 fails" );
  assert.ok( NaN, "NaN fails" );
  assert.ok( "", "empty string fails" );
  assert.ok( null, "null fails" );
  assert.ok( undefined, "undefined fails" );
});

当然还有equal函数，用来比较两个的值是否相等（不会来比较数据类型）。相当于是“==”，所以它不能用于比较数组和对象。

例：

QUnit.test( "equal test", function( assert ) {
        assert.equal( 0, 0, "Zero, Zero; equal succeeds" );
        assert.equal( "", 0, "Empty, Zero; equal succeeds" );
        assert.equal( 1, "1", "Empty, Empty; equal succeeds" );
        assert.equal( true, "1", "Empty, Empty; equal succeeds" );
        assert.equal( true, 1, "Empty, Empty; equal succeeds" );
        assert.equal( "", "", "Empty, Empty; equal succeeds" );
        
        assert.equal( "three", 3, "Three, 3; equal fails" ); 
        assert.equal( null, false, "null, false; equal fails" ); 
    });

当然如果要比较数组和对象，那么就要你用到same()这个函数。

用法也很简单，大家直接看API文档就好了http://api.qunitjs.com/category/all/

在这里还有几篇文章，值得一看：

张大神：http://www.zhangxinxu.com/wordpress/2013/04/qunit-javascript-unit-test-%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95/

国外的一篇：http://code.tutsplus.com/tutorials/how-to-test-your-javascript-code-with-qunit--net-9077