Heim > Web-Frontend > js-Tutorial > Detaillierte Einführung in das Javascript-Unit-Testing-Framework QUnitjs_javascript-Kenntnisse

Detaillierte Einführung in das Javascript-Unit-Testing-Framework QUnitjs_javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 16:49:15
Original
1431 Leute haben es durchsucht

1. Was ist QUnit

QUnit (http://qunitjs.com/) ist ein sehr leistungsfähiges Javascript-Unit-Test-Framework, das Ihnen beim Debuggen Ihres Codes helfen kann. Es wurde von Mitgliedern des jQuery-Teams geschrieben und ist die offizielle Testsuite für jQuery. Aber QUnit reicht im Allgemeinen aus, um jeden regulären Javascript-Code zu testen, und es ist möglicherweise sogar möglich, serverseitiges JavaScript über einige Javascript-Engines wie Rhino oder V8 zu testen.
Wenn Sie mit dem Konzept des „Unit-Tests“ nicht vertraut sind, machen Sie sich keine Sorgen. Es ist nicht so schwer zu verstehen:

Kopieren Sie den CodeDer Code lautet wie folgt:

In der Computerprogrammierung, Unit-Tests (auch Unter „Modultests“ bekannt) versteht man die Testarbeit zur Überprüfung der Korrektheit des Programmmoduls (der kleinsten Einheit des Softwaredesigns). Eine Programmeinheit ist die kleinste testbare Komponente einer Anwendung. Bei der prozeduralen Programmierung ist eine Einheit ein einzelnes Programm, eine einzelne Funktion, ein einzelner Prozess usw.; bei der objektorientierten Programmierung ist die kleinste Einheit eine Methode, einschließlich Methoden in Basisklassen (Superklassen), abstrakten Klassen oder abgeleiteten Klassen (Unterklassen). — Zitiert aus Wikipedia.


Einfach ausgedrückt schreiben Sie Tests für jede Funktion Ihres Codes, und wenn alle diese Tests bestanden werden, können Sie sicher sein, dass der Code keine Fehler aufweist (normalerweise hängt es wiederum davon ab, wie gut Ihre Tests sind). ) kommt ganz darauf an).


2. Warum sollten Sie Ihren Code testen

Wenn Sie noch nie einen Unit-Test geschrieben haben, können Sie Ihren Code direkt auf die Website hochladen, eine Weile klicken, um zu sehen, ob es Probleme gibt, und versuchen, die gefundenen Probleme mithilfe dieser Funktion zu lösen. Es gibt viele Probleme mit der Methode.
Erstens ist das langweilig. Das Klicken ist eigentlich keine leichte Aufgabe, da Sie sicherstellen müssen, dass alles angeklickt wird, und es besteht eine gute Chance, dass Sie ein oder zwei übersehen haben.

Zweitens ist alles, was Sie zum Testen tun, nicht wiederverwendbar, was bedeutet, dass eine Regression schwierig ist. Was ist Regression? Stellen Sie sich vor, Sie schreiben Code, testen ihn, beheben alle gefundenen Fehler und veröffentlichen ihn dann. An diesem Punkt sendet ein Benutzer Feedback zu einem neuen Fehler und benötigt einige neue Funktionen. Sie gehen zurück in den Code, beheben diese neuen Fehler und fügen neue Funktionen hinzu. Als nächstes kann es passieren, dass einige alte Mängel wieder auftauchen. Dies wird als „Regression“ bezeichnet. Sehen Sie, jetzt müssen Sie noch einmal klicken, und die Chancen stehen gut, dass Sie diese alten Fehler noch nicht finden. Und selbst wenn, dann wird es eine Weile dauern, bis Sie herausfinden, dass Ihr Problem durch eine Regression verursacht wird. Beim Unit-Testen schreiben Sie Tests, um Fehler zu finden, und sobald der Code geändert wurde, filtern Sie die Tests erneut. Wenn eine Regression auftritt, schlagen einige Tests fehl, und Sie können sie leicht identifizieren und wissen, welcher Teil des Codes den Fehler enthält. Da Sie nun wissen, was Sie gerade geändert haben, können Sie es leicht beheben.

Ein weiterer Vorteil von Unit-Tests, insbesondere für die Webentwicklung: Es erleichtert das Testen der browserübergreifenden Kompatibilität. Führen Sie Ihre Testfälle einfach in verschiedenen Browsern aus, beheben Sie das Problem und führen Sie die Testfälle erneut aus, um sicherzustellen, dass es in anderen Browsern nicht zu Regressionen führt. Sobald sie alle erfolgreich sind, können Sie sicher sein Angenommen, alle Zielbrowser unterstützen es.

Ich möchte ein Projekt von John Resig erwähnen: TestSwarm(http://testswarm.com/). Es bringt Javascript-Unit-Tests auf die nächste Ebene, indem es verteilt wird. Es handelt sich um eine Website mit vielen Testfällen, und jeder kann dorthin gehen und einige Testfälle ausführen, und die Ergebnisse werden an den Server zurückgegeben. Auf diese Weise kann der Code sehr schnell in verschiedenen Browsern und sogar verschiedenen Plattformen getestet werden.

3. So schreiben Sie Unit-Tests mit QUnit

Wie schreibt man Unit-Tests mit QUnit richtig? Zuerst müssen Sie eine Testumgebung einrichten:

Kopieren Sie den Code Der Code lautet wie folgt:




    QUnit Test Suite
   
   
   
    < ;script type="text/javascript" src="myTests.js">


   

QUnit Test Suite


   


   

   


   




    正如你所见,在这里使用了一个被托管的QUnit框架版本.
    将要被测试的Verwenden Sie die Datei myProject.js而且你的测试应该插入到 myTest.js写些测试的时间了.
    单元测试的基石是断言:

    断言是一个命题,预测你的代码的返回结果。如果预测是假的,断言失败,你就知道出了问题。


    运行断言,你应该把它们放入测试案例:

    复制代码 代码如下:

    // Testen wir diese Funktion
    function isEven( val) {
        Rückgabewert % 2 === 0;
    }

    test('isEven()', function() {
        ok(isEven(0), 'Null ist eine gerade Zahl');
        ok(isEven(2), 'So ist zwei') ;
        ok(isEven(-4), 'So ist minus vier');
        ok(!isEven(1), 'Eins ist keine gerade Zahl');
        ok(!isEven(- 7), 'Weder ist negativ sieben');
    })


    这里我们定义一个函数:isEven, 用来检测一个数字是否为奇数, 并且我们希望测试这个函数来确认它不会返回错误答案.
    我们首先调用test(),它构建了一个测试案例;第一个参数是一个将被显示在结果中的字符串,第二个参数是包括我们断主的一个回调函数.
    我们写了5个断言,所有的都是布尔型的.一个布尔型的断言,期望它的第一个参数为true.第二个参数依然是要显示在结果中的消息.
    这里是你想要得到的,只要你运行测试:

    Detaillierte Einführung in das Javascript-Unit-Testing-Framework QUnitjs_javascript-Kenntnisse

    四、深入学习参考

    以上只简单的介绍了 qunit.js, 其断言方法还有很多, 具体可参考 API. 文档:
    http://api.qunitjs.com/
    单元测试是一个在你发布你的代码前测试你的代码的非常好的方法.如果你以前没有写过任何的单元测试始了!

    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage