javascriptよくあるエラー

9755 ワード

(JSのデバッグに役立つ文章を見て、コレクションしてください.)
JavaScriptデバッグは悪夢です.まず与えられたエラーは非常に理解しにくいです.次に与えられた行番号はいつも助けになりません.エラーの意味を検索したり、修正措置のリストがありますが、とても役に立ちますか?
以下は奇妙なJavaScriptエラーリストです.同じエラーでも、ブラウザによっては異なるメッセージが与えられますので、いくつかの異なる例があります.
どうやって読み間違えますか?
まず、間違った情報の構造を早く見ましょう.構造を理解することはエラーを理解するのに役立ちます.リスト以外のエラーが発生するとトラブルが減ります.
Chromeの典型的なエラーはこのようにしています.
Uncaught TypeError: undefined is not a function
エラーの構造は以下の通りです.
  • Uncaught TypeError: この部分の情報は通常あまり役に立ちません.Uncaught エラーが発生しませんでした.  catch ステートメント捕獲 間違った名前です.
  • TypeError この部分の情報は一字ずつ読まなければなりません.たとえばここでコードを使ってみます.  undefined is not a function: ,それを関数として扱う.
  • 他のwebkitベースのブラウザ、例えばSafariはChromeと似たようなエラーフォーマットを提供しています.Firefoxも同様ですが、常に第1の部分を含みません.最新バージョンのIEもChromeより簡単なエラーを提供します.しかし、ここでは簡単なことは総代表ではありません.
    以下は本当のエラーです.undefined関連エラー:
    number is not a function, object is not a function, string is not a function, Unhandled Error: ‘foo’ is not a function, Function Expected
    
    この値は、方法のような値を呼び出そうとすると、方法ではありません.たとえば:
    var foo = undefined;
    foo();
    
    オブジェクトを呼び出す方法を試したら、名前を間違えて入力してしまいます.この典型的なエラーが発生しやすいです.
    var x = document.getElementByID('foo');
    
    オブジェクトの属性が存在しないため、デフォルトは  Uncaught TypeError: undefined is not a function ,以上のコードはこのエラーを引き起こします.メソッドの数字を呼び出してみましたが、「number is not a function」にエラーが発生しました.
    エラーの修復方法:正しい方法名を確保する.このエラーの行番号は正しい位置を指摘します.undefined関連エラー:
    Uncaught exception: ReferenceError: Cannot assign to ‘functionCall()’, Uncaught exception: ReferenceError: Cannot assign to ‘this
    与えられないものに価値を与えてみて、このエラーを引き起こします.
    このエラーの最も一般的な例はif文で使われています.
    if(doSomething() = 'somevalue')
    
    この例では、プログラマは、デュアル等号ではなく、意外にも単一の等号を使用している.「left-hand side in assigment」は等号の左側の部分に言及しています.このような例を見ると、左手には与えられないものが含まれています.
    どのようにエラーを修復しますか?関数の結果に値を付けていないか?  Uncaught ReferenceError: Invalid left-hand side in assignment キーワードの割り当てthis関連エラー:
    Uncaught exception: TypeError: JSON.stringify: Not an acyclic Object, TypeError: cyclic object value, Circular reference in value argument not supported
    
    循環参照の対象を、  Uncaught TypeError: Converting circular structure to JSON いつも間違いを起こす.
    var a = { };
    var b = { a: a };
    a.b = b;
    JSON.stringify(a);
    
    以上のことで  JSON.stringify 和  a 相互参照を繰り返します.結果、オブジェクトはJSONに変換できません.
    エラーの修復方法: JSONに変換したいオブジェクトの循環参照を削除します.b関連エラー:
    Expected ), missing ) after argument list
    
    JavaScript解釈器の予想されるものは含まれていません.不一致の括弧または四角い括弧はしばしばこのエラーを引き起こし、エラー情報は異なるかもしれない. または  Unexpected token ; など
    エラーの修復方法: エラーが発生した行番号が正確ではないため、修復が難しい場合があります.
  • “Unexpected token ]”  “Expected {”  [ ] このいくつかの記号がマッチングしないとよくエラーが発生します.すべての丸括弧と四角い括弧がペアになっているかどうかを確認します.行番号は問題文字だけではないと指摘しています.
  • { } 正規表現と関係があります.このときの行番号は通常正しいです.
  • ( ) オブジェクトまたは配列の字面量の中に一つがあります.このエラーを引き起こしたり、関数で呼び出したパラメータリストにはセミコロンがあります.このときの行番号も通常正しいです.
  • Unexpected /関連エラー:
    Unterminated String Literal, Invalid Line Terminator
    
    文字列の文字列の文字列の量が少なくなりました.最後の引用符です.
    エラーの修復方法: すべての文字列に終わりの引用符があることを確認します.Unexpected ;関連エラー:
    TypeError: someVal is null, Unable to get property ‘foo’ of undefined or null reference
    
    読み込みを試みる  Uncaught SyntaxError: Unexpected token ILLEGAL または  Uncaught TypeError: Cannot read property ‘foo’ of null, Uncaught TypeError: Cannot read property ‘foo’ of undefined ,それを対象にしました.たとえば:
    var someVal = null;
    console.log(someVal.foo);
    
    エラーの修復方法: スペルミスによるものが多いです.エラーが指摘された行番号の近くで使用されている変数名が正しいかどうかを確認します.null関連エラー:
    TypeError: someVal is undefined, Unable to set property ‘foo’ of undefined or null reference
    
    書き込みを試みる null または undefined ,それを対象としています.たとえば:
    var someVal = null;
    someVal.foo = 1;
    
    エラーの修復方法: スペルミスによるものです.エラーが指摘した行番号の近くの変数名をチェックします.undefined関連エラー:
    Related errors: Uncaught exception: RangeError: Maximum recursion depth exceeded, too much recursion, Stack overflow
    
    通常プログラム論理bugによって引き起こされ、関数の無限再帰的呼び出しが生じる.
    エラーの修復方法: 再帰関数では無限ループのbugを引き起こす可能性があることを確認します.Uncaught TypeError: Cannot set property ‘foo’ of null, Uncaught TypeError: Cannot set property ‘foo’ of undefined関連エラー:
    URIError: malformed URI sequence
    
    無効なdecodeURIComponentの呼び出しによるものです.
    エラーの修復方法: 誤って指摘された行番号に従って、チェックします.  Uncaught RangeError: Maximum call stack size exceeded 呼び出しは正しいです.Uncaught URIError: URI malformed関連エラー:
    Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at
    [http://some/url/](http://some/url/)
    
    間違いはXMLHttpRequestを使って起こるに違いない.
    どうやって修復しますか 要求されたURLが正しいことを確認し、ソースポリシーに従います. .最も良い方法は、コードから間違った情報が指摘されているURLを見つけることです.decodeURIComponent関連エラー:
    InvalidStateError, DOMException code 11
    
    コードコールの方法は現在の状態では起動できません.通常  XMLHttpRequest cannot load [http://some/url/](http://some/url/). No ‘Access-Control-Allow-Origin’ header is present on the requested resource したがって、メソッドの準備が完了する前に呼び出しはエラーを引き起こします.
    var xhr = new XMLHttpRequest();
    xhr.setRequestHeader('Some-Header', 'val');
    
    この時は間違います.  InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable 方法は  XMLHttpRequest メソッドは後で呼び出します.
    どうやって修復しますか エラーが指摘している行番号を確認して、コードの運行タイミングが正しいか、またはそれ(例えば、  setRequestHeader)前に不必要な呼び出しを追加しました.
    結論
    私は多くの無用なJavaScriptのエラーを見ました.例えばPHPでの評判の悪さのようです.  xhr.open .もっと熟知しているミスを捨てればこそ、もっと意味があります.現代のブラウザでは、完全に不要なエラーを出さないと、もっと役に立ちます.