javascript高級プログラム設計14-エラー処理とデバッグを読みます.

9594 ワード

1つ  エラーの種類
ECMAは、一般的な7つのエラータイプを規定している.
  • Err:ベースタイプ.他のよくあるエラータイプはこのタイプから継承されています.一般的に開発者がカスタムエラーを出すために使用されます.
  • EveralError:このタイプはeval()関数が異常を使用した時に投げ出されます.例えば、new eval();実際にはいくつかのバージョンのブラウザでType Errerを投げます.また、自身のeval関数は実際の開発においては慎重に使用します.EveralErrorを投げる確率は小さいです.
  • RangeError:数値が範囲外にあるときにトリガします.例えば、new Aray(-1)/RangeErr:invalid array length.
  • ReferrerErrer:通常、存在しない変数にアクセスすると、このエラーがトリガされます.ReferenceError:a is not defined
  • SyntxErrror:文法エラーのJavaScript文字列をeval()関数に渡すと、このタイプのエラーが発生します.eval(consolie.log(a)+)
  • Type Error:特定の操作を行うと、変数型が一致しないとタイプエラーが発生します.一般的ないくつかの場合は、アクセスが存在しない方法、関数着信パラメータタイプが一致しないなどです.
  • URIError:encodeURI()とdecodeURI()の方法を使用して、URIのフォーマットが正しくないとこのエラーが発生します.
  • ブラウザをまたいでプログラミングする場合、エラータイプをあらかじめチェックすることは、処理方式を決定する方法の一つであり、つまりtry-catch文でエラーを捉えてから、catchブロックでinstance ofオペレータを使ってエラータイプを判断し、最後に異なるエラータイプによって対応する処理を行うことである.
    try {
    new 1;
    } 
    catch (error) {
    if (error instanceof EvalError) {
    console.log('eval    ');
    } 
    else if (error instanceof TypeError) {
    console.log('    ');
    } else {
    console.log(error.message);
    }
    }
    二キャプチャーエラーと投げエラー
    1.try-catch文捕捉エラー
    try-catch文はよく使われる誤りを捉える方式です.その中でcatchには、エラー情報を含むオブジェクトのerrorがあります.このオブジェクトを使わなくても名前を付けます.文法エラーが発生します.catchのオブジェクトerrorには共通の属性messageがあります.具体的なエラー情報を保存します.
    try {
      window.a();
    } catch (error) {
      alert(error.message);
    }
    finally子文:finally子文を含む場合、try分岐を実行してもcatch分岐を実行しても最後に必ずfinally分岐を実行します.途中でreturn文があってもfinally子文の実行を阻止することはできません.
    try {
      console.log(1);
    } catch (error) {
      console.log(2);
    } finally {
      console.log(3);
    }
    try-catchはコントロールできないエラーを処理するのに適しています.
    2.エラーの投げ方
    Try-catch文が投げられた値を捉えると、コードはエラーを出すために使用されます.ある種類のエラータイプを使うと、よりリアルなシミュレーションブラウザエラーが発生します.例:
    throw new Error("test throw error");
    よく使われるエラーのタイプは、Errer,RangeErr,ReferenceErr,TypeErrorです.
    プロトタイプチェーンを利用して、Errを継承することにより、カスタムエラータイプを作成することができます.例えば、
    function MyError(message) {
    this.name = 'MyError';
    this.message = message;
    }
    MyError.prototype = new Error();
    throw new MyError('this is my test error;');
    コード量が大きいプログラムについては、元のエラー情報によっては、直接的な位置決めが難しい場合があります.この時、適切な情報を持ったカスタムエラーによって、コードのメンテナンス性が著しく向上します.開発中、特に注目すべきのは、関数とパラメータタイプの検査など、関数が失敗しやすい位置です.
    function test(value) {
    if (!(value instanceof Array)) {
    throw new Error('test():      ');
    }
    return value.sort();
    }
    つまり、エラーを出す目的はエラー発生の具体的な原因に関する詳細情報を提供することです.エラーをキャプチャする目的は、ブラウザがデフォルトでエラーを処理することを避けることです.
    いくつかのよくあるエラーシーン
    JavaScriptはフリータイプで、関数のパラメータタイプは確認されません.したがって、エラーはコード実行中に発生します.よくある3種類のエラーのタイプは、タイプ変換エラー、データタイプエラー、通信エラーです.
    1.タイプ変換エラー
    タイプ変換エラーは、あるオペレータを使ったり、データタイプを自動変換したりする場面でよく発生します.
    第一のよくあるエラーは等しいかどうか操作しないでください.
    console.log(1=="1");//true
    console.log(1==true);//true
    改善:全等(==)と非全等(==)のオペレータを使用することを推奨します.等しい操作と異なる操作を使用した場合に生じるタイプの変換エラーが発生しないようにします.
    console.log(1==="1");//false
    console.log(1===true);//false
    第二の共通のエラーは、フロー制御文で非ブール値を使用します.
    function concat(str1,str2){
    if(str2){
    return str1+str2;
    }
    else{
    return str1;
    }
    }
    concat('a',0);//a"
    concat('a',1);//"a1"
    この方法の目的は、2番目のパラメータが存在する場合、2つの文字列のスティッチング結果を返すことである.第二のパラメータが存在しない場合は、直接に第一のパラメータに戻ります.しかし、undefinedはブール値falseに変換されます.0はfalseに変換されます.1はtrueに変換されます.したがって、呼び出しの結果は本意と一致しません.
    改善:
    function concat(str1,str2){
    if(typeof str2=="string"){
    return str1+str2;
    }
    else{
    return str1;
    }
    }
    concat('a',0);//a"
    concat('a',1);//"a"
    2.データタイプエラー
    JavaScriptでは、変数や関数パラメータを使う前には、自動的にタイプ検査を行いません.そのため、開発者自身がデータタイプの検出コードを作成する必要があります.例えば、
    function reverseSort(values) {
    if (values) {//              
    values.sort();
    values.reverse();
    }
    
    console.log(values); 
    }
    reverseSort("a");//TypeError
    ここに入ってきたパラメータが配列タイプでないとデータタイプエラーが発生します.基本タイプに対してtypeofを使ってタイプ検査を行い、対象タイプに対してinstance ofを使ってタイプ検査を行います.
    function reverseSort(values) {
    if (values instanceof Array) {
    values.sort();
    values.reverse();
    }
    console.log(values);
    }
    reverseSort("a");//a"
    reverseSort([6,2,3,8,1,5]);//[8, 6, 5, 3, 2, 1]
    3.通信エラー
    シーン1は、データをサーバに送信する前に、encodeURIComponentを使用せずにデータを符号化することである.例えば、
    www.cnblogs.com?backurl=http
    ://www.cnblogs.com?a=1
    解決策は、エンコーディングを使用してバッククルの後のパラメータをエンコードした結果、
    www.cnblogs.com?backurl= http%3A%2F%2Fwww.cnblogs.com%3Fa%3D1
    シーン2は、クエリー文字列に対しても、クエリーパラメータの名前と値をエンコードします.
    四番目  エラーをサーバに記録します.
    前後のエラー情報をまとめて記録すれば、データベースのエラーログの分析が非常に便利になります.JavaScriptエラーをサーバに記録するにはイメージコントロールを使って行う必要があります.すべてのブラウザはイメージオブジェクトに対応しています.また、ドメイン制限を避けることができます.
    まず、エラーデータを処理するためにサービス端末ページを新規作成します.このページは検索文字列からエラーデータを取得し、その後、エラーログにデータを書き込みます.例えば、このページはa.asxです.
    そして呼び出しページでイメージオブジェクトを作成し、そのsrc属性に値を付けることで、エラー情報をサービス端末ページに送信することができます.
    function logError(msg) {
    var img = new Image();
    img.src = 'a.ashx?msg=' + encodeURIComponent(msg);
    }