JavaScript忍者秘籍ノート——テストとデバッグを利用して武装自体を調整する.

6155 ワード

第二章テストを利用して武装自体を調整する
デバッグコード
javascriptのデバッグには二つの重要な方法があります.ログ記録とブレークポイント
ログログconsole.log()方法を使用して、コンソールでログメッセージを確認する.
ブレークポイント
すべてのアクセス可能な変数、コンテキスト、およびスコープを含む、ブレークポイントで任意のコードの状態を任意に見ることができます.
テストケースの生成
優れたテストケースは三つの重要な特徴を持っています.

反復性(repeability)――試験結果は高度再生可能であるべきである.複数のテストを実行すると同じ結果が出るはずです.

シンプル性——テストはテストだけに集中すべきです.テストケースの目的に影響がない場合は、できるだけ多すぎるHTMLマーク、CSSまたはJavaScriptを除去しなければならない.

独立性(independence)――テストケースは独立して実行すべきである.試験結果は他の試験結果に依存することを避ける.

テストを構築する主な方法はそれぞれです.

構文試験:弱コード分離問題を解消する際に作成し、不適切な問題を解消します.

構築型テスト:よく知られている簡潔なシーンから、バグが再現されるまで用例を構築する.

テストフレーム
テストの必要に応じて、Javascriptテストのフレームワークから多くの機能を見つけられます.

は、ブラウザの挙動をシミュレートすることができる(ボタンをクリックするなど).

試験のインタラクティブ制御(テストの一時停止と回復).

非同期テストのタイムアウト問題を処理します.

は、実行されるテストをフィルタすることができます.

テストキットの基礎知識
テストキットの主な目的は、集合コード内のすべての単一テストを組み合わせて一つの単位にすることです.これにより、大量に実行できます.簡単に繰り返し実行できる単一のリソースを提供します.
言い‐きる
ユニットテストフレームの核心は、断言方法であり、通常はクラス()と呼ばれる.この方法は、断言すべき値と、その断言の目的を表す記述とを受信する.この値がtrueであれば通過すると断言し、失敗と断言します.



    
        //   assert  
        function assert(value,desc){
            var li = document.createElement('li');
            li.className = value ? "pass" : "fail";
            li.appendChild(document.createTextNode(desc));
            document.getElementById("results").appendChild(li);
        }

        //         
        window.onload = function() {
            assert(true, "  running...");
            assert(false, "  ！");
        }

テストグループ
ユニットテストを実行する時、一つのテストグループは断言してもいいです.これらは私たちのAPIまたはプログラムに関連しているのは単一の方法です.行動駆動開発をすれば、テストチームはタスク統合によって断言されます.実際には動的制御レベルが非常に有用であることが証明されている(テストに失敗すればテストグループを収縮／展開し、フィルタテストが可能である).



    
        (function(){
            var results;

            this.assert = function assert(value,desc){
                var li = document.createElement('li');
                li.className = value ? "pass" : "fail";
                li.appendChild(document.createTextNode(desc));
                results.appendChild(li);
                if(!value){
                    li.parentNode.parentNode.className = "fail";
                }
                return li;
            };

            this.test = function test(name,fn){
                results = document.getElementById("results");
                results = assert(true,name).appendChild(document.createElement("ul"));
                fn();
            };
        })();

        window.onload = function (){
            test("A test", function(){
                assert(true, "First assertion completed");
                assert(true, "Second assertion completed");
                assert(true, "Third assertion completed");
            });

            test("Another test", function(){
                assert(true, "First assertion completed");
                assert(false, "Second assertion failed");
                assert(true, "Third assertion completed");
            });

            test("A third test", function(){
                assert(null, "fail");
                assert(5, "pass");
            })
        }

非同期テスト
この問題を処理する方法は、通常は過度に設計され、実際に必要とされるより複雑に設計される.非同期テストを処理するには、従うべき簡単なステップが必要です.

は、同じ非同期動作に依存する断言を統一されたテストグループに結合する.

各テストグループは、前の他のテストグループが運転を完了した後、1つのキューに置く必要があります.



    
        (function(){
            var queue = [], paused = false, results;

            // test              ，          ，       ——           
            this.test = function(name,fn){
                queue.push(function(){
                    results = document.getElementById("results");
                    results = assert(true,name).appendChild(
                        document.createElement("ul"));
                        fn();
                });
                runTest();
            };

            // pause    test    ，             ，       
            this.pause = function(){
                paused = true;
            };

            // resume     ，               ，             
            this.resume = function(){
                paused = false;
                setTimeout(runTest,1);
            };

            //                  。                            ，      ，                 
            //         ，runTest              ，     （    ，          ），runTest           
            function runTest(){
                if(!paused && queue.length){
                    queue.shift()();
                    if(!paused){
                        resume();
                    }
                }
            }

            this.assert = function assert(value,desc){
                var li = document.createElement("li");
                li.className = value ? "pass" : "fail";
                li.appendChild(document.createTextNode(desc));
                results.appendChild(li);
                if(!value){
                    li.parentNode.parentNode.className = "fail";
                }
                return li;
            };
        })();

        window.onload = function(){
            test("Async Test #1", function(){
                pause();
                setTimeout(function(){
                    assert(true, "First test completed");
                    resume();
                },1000);
            });

            test("Async Test #2", function(){
                pause();
                setTimeout(function(){
                    assert(true, "Second test completed");
                    resume();
                },1000);
            });
        }

java高分局のclassファイル解析