JavaScript エラー処理メカニズムの概要 (例付き)

この記事では、JavaScript のエラー処理メカニズムについて説明します (例を示します)。必要な方は参考にしてください。

場合によっては、カプセル化したツール関数でパラメーターが渡されないか、間違った型のパラメーターが渡された場合、フレームワークが正常に動作していない場合にもエラーがスローされることがあります。通常どおりに使用すると、何か問題が発生した場合、エラーについて何も知らなければ、デバッグできません。上記に基づいて、エラー処理メカニズムを理解する必要があります。

以下は著者による要約です。間違いがあればご指摘ください。

エラー コンストラクター
JavaScript 仕様には合計 8 つのエラー タイプ コンストラクターがあります
Error -- エラー オブジェクト
SyntaxError -- プロセス構文エラーの解析
TypeError -- 無効ですタイプ
ReferenceError -- 無効な参照
RangeError -- 値が有効な範囲を超えています
URIError -- URI エンコーディングの解析エラー
EvalError -- eval 関数の呼び出しエラー
InternalError -- Javascriptエンジンの内部エラー 例外がスローされました、「再帰が多すぎます」

そのうちの 2 つは特別に説明されています:
EvalError は eval 関数の呼び出し時のエラーであり、下位互換性のために、以前のバージョンは非推奨になっています。使用済み。
InternalError は、再帰が深すぎる場合にエラーをスローします。ほとんどのブラウザではこれが実装されていないため、運用環境では無効になっています。
継承関係
Error は、の基本クラスです。他の型は Error クラスを継承し、ES6 で提供される Object.getPrototypeOf() を使用して、クラスが別のクラスを継承するかどうかを判断できます。

console.log(Object.getPrototypeOf(SyntaxError) === Error);    // true
console.log(Object.getPrototypeOf(TypeError) === Error);   // true
console.log(Object.getPrototypeOf(RangeError) === Error);   // true
console.log(Object.getPrototypeOf(URIError) ===  Error);   // true
console.log(Object.getPrototypeOf(EvalError) === Error);   // true
console.log(Object.getPrototypeOf(ReferenceError) === Error); // true

各エラー タイプの使用法とエラー シナリオについて説明します。

Error
エラー オブジェクトは、Error コンストラクターを通じて作成できます。実行時エラーが発生すると、Error インスタンス オブジェクトがスローされます。
構文: new Error([message])
パラメータ:

message 可选，错误描述信息。

エラーをスローする
throw ステートメントを使用して例外をスローする
throw new Error('ここでスローされる内容はエラー メッセージです')
実行後、コンソールに出力されます:
Uncaught Error: エラー メッセージはここにスローされます
注: throw を使用して例外をスローした後、後続のコードは実行されなくなります。処刑される。

エラーのキャプチャ
try{}catch(){} ステートメントを通じてこのエラーをキャプチャできます

try{
   throw new Error('这里抛出的是错误信息')
 }
 catch(err){
   alert(err.name + ' '+ err.message)
   }

属性の説明:

 当使用new Error创建错误实例后，会有两个属性：

let e = new Error('ここにスローされるのはエラー メッセージです');
name 属性はエラーの種類です。今回は Error
message 属性です。これはエラー メッセージです。今回は'thrown here' エラー メッセージは '

SyntaxError
解析プロセスでの構文エラーです。このタイプによってスローされるエラーは数多くあります。多くの場合、次のような書き込み時に文法エラーが発生します。

let n = 11;   // Uncaught SyntaxError: Invalid or unexpected token
let str = "hel"lo" // Uncaught SyntaxError: Unexpected identifier
let 123Var = 'hi' // Uncaught SyntaxError: Invalid or unexpected token

構文エラーが多数あるため、1 つずつリストすることはしません。ブラウザーで実行すると、コンソールがエラーをスローして、それがどの行であるかを示すため、より便利です。それを使用するデバッガ。ただし、エラーを簡単に修正できるように、SyntaxError としてのエラー タイプとそれに続くエラー メッセージを理解する必要があります。

TypeError

は有効な型ではありません。この種のエラーは、指定された型が必要な型ではないことを意味し、その結果、操作不能になり、型エラーがスローされます。
変数またはパラメーターは予期された型ではありません。
変数またはパラメーターは予期された型ではありません。
たとえば、
new の後には関数が続き、指定された1 つは関数ではないため、型エラーがスローされます

let fn = 'hello';
new fn;

エラーがスローされます:

Uncaught TypeError: fn はコンストラクターではありません
オブジェクトに存在しないメソッドの呼び出し

let obj = {};
obj.fn()

エラーをスローします:

Uncaught TypeError: obj.fn は関数ではありません
もちろん、関数をカプセル化するときに受信パラメータを強制的に指定された型にすることもできます。型エラーがスローされます。

function flatten(arr){
if( !Array.isArray(arr) )
{
       throw new TypeError('传入参数不是数组')   
}    
}

flatten('test');

受信パラメータが配列ではない場合、カスタム型エラーがスローされます:

Uncaught TypeError: 受信パラメータは配列ではありません

ReferenceError

無効な参照です。

存在しない変数を参照します

console.log(a);

エラーをスローします

キャッチされない参照エラー: a が定義されていません
変数を割り当てることができないデータに変数を割り当てますvalue
この間違いは、メソッドを呼び出した後の if ステートメント内で、文字列の最初の文字が指定された文字であるかどうかを判断する場合によく発生します。 :

let str = 'hello';
if( str.charAt(0) = 'h' ){
   console.log('第一个字符为h');
   }

エラーが発生します:

Uncaught ReferenceError: Invalid left-hand side in assigning
RangeError
値が有効な範囲外です。一部のメソッドでは、渡される値は特定の範囲内である必要があり、そうでない場合は範囲​​外エラーがスローされます。
配列の作成時に渡された長さは 0 未満です

let arr = new Array(-1)

エラーがスローされます:

Uncaught RangeError: Invalid array length
repeat メソッドは指定された文字列をその数だけ繰り返します繰り返される回数は 0 未満です

let str = 'hello';
str.repeat(-1)

エラーをスローします:

Uncaught RangeError: Invalid count value

URIError

URI エンコーディングの処理中にエラーが発生しました。関数パラメータが正しくありません。主に、6 つの関数 encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()、および unescape() です。
例:

decodeURIComponent('%');
decodeURI('%2')

エラーをスローします:

Uncaught URIError: URI malformed

カスタム エラー タイプ

エラーをカスタマイズしたい場合があります。 type を使用するには、コンストラクターをカスタマイズしてから、プロトタイプに Error.prototype を継承させる必要があります。

function MyErrorType(message){
this.message = message || '错误';
this.name = 'MyErrorType';
this.stack = (new Error()).stack;  // 错误位置和调用栈
}
MyErrorType.prototype = Object.create(Error.prototype);
MyErrorType.prototype.constructor = MyErrorType;
throw new MyErrorType('自定义错误类型抛出错误')

关于调用的错误栈信息
提供的错误的跟踪功能，以什么样的调用顺序，在哪个文件的哪一行捕获到这个错误。
例如以下调用：

 function trace() {
  try {
        throw new Error('myError');
  }
  catch(e) {
        console.log(e.stack);
  }
  }
function b() {
trace();
}
function a() {
b(3, 4, '\n\n', undefined, {});
}
a('first call, firstarg');

错误信息为：
Error: myError
  at trace (:3:14)
  at b (:10:6)
  at a (:13:6)
  at :15:4
以上为抛错的构造函数的总结，如有误之处欢迎扶正。

以上がJavaScript エラー処理メカニズムの概要 (例付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。