JavaScript 오류 처리 메커니즘 소개(예제 포함)

이 글은 JavaScript 오류 처리 메커니즘을 소개합니다(예제 포함). 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

캡슐화한 도구 함수에서 매개변수가 전달되지 않거나 잘못된 유형의 매개변수가 전달되면 경고로 일부 오류가 발생합니다. 프레임워크가 정상적으로 사용되지 않으면 오류도 발생합니다. 오류에 대해 아무것도 모르면 디버깅할 수 없습니다. 위의 내용을 바탕으로 오류 처리 메커니즘을 이해하는 것이 필요합니다.

다음은 작성자의 요약입니다. 틀린 부분이 있으면 지적해주세요.

Error constructor
JavaScript 사양에는 총 8개의 오류 유형 생성자가 있습니다.
Error -- 오류 개체
SyntaxError -- 구문 분석 중 구문 오류
TypeError -- 유효한 유형에 속하지 않습니다.
ReferenceError -- 잘못된 참조
RangeError -- 숫자 값이 유효한 범위를 벗어남
URIError -- URI 인코딩 구문 분석 중 오류
EvalError -- 평가 함수 호출 중 오류
InternalError -- Javascript 엔진 내부 오류 예외 발생, "재귀가 너무 많습니다"

그 중 두 가지는 특별히 설명:
EvalError 호출 eval 함수가 잘못되어 더 이상 사용되지 않습니다. 이전 버전과의 호환성을 위해 더 낮은 버전을 계속 사용할 수 있습니다.
InternalError는 재귀가 너무 깊으면 오류를 발생시킵니다. 이는 비표준 방법이며 프로덕션 환경에서는 비활성화됩니다.
상속 관계
Error는 오류의 기본 클래스입니다. 오류 클래스. ES6에서 제공하는 객체인 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 可选，错误描述信息。

오류 발생
throw 문을 사용하여 예외 발생
throw new Error('여기에 오류 메시지가 발생합니다')
실행 후 표시됩니다. 콘솔 인쇄 출력:
Uncaught Error: 여기에 던져진 오류 메시지는
Note: 예외를 발생시키기 위해 throw를 사용한 후에는 후속 코드가 더 이상 실행되지 않습니다.

Catch 오류
try{}catch(){} 문

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

을 통해 이 오류를 캡처할 수 있습니다. 속성 설명:

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

let e = new Error('여기에 오류 메시지가 표시됩니다');
name 속성은 오류 종류입니다. 이때 오류 메시지는 '여기에 오류 메시지가 발생합니다'

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

브라우저에서 실행할 때 문법 오류가 너무 많아서 하나씩 나열하지는 않습니다. 콘솔은 오류를 발생시키고 어떤 줄인지 알려 주므로 디버거가 더 편리합니다. 하지만 오류 유형을 SyntaxError로 이해하고 그에 따른 오류 메시지를 이해해야 오류를 쉽게 수정할 수 있습니다.

TypeError

은(는) 유효한 유형이 아닙니다. 이런 종류의 오류는 주어진 유형이 필수 유형이 아니므로 작동 불가능하게 되고 유형 오류가 발생함을 의미합니다.
변수 또는 매개변수가 예상된 유형이 아닙니다.
변수 또는 매개변수가 예상된 유형이 아닙니다.
예를 들어
new 연산자 뒤에는 함수가 와야 하며 주어진 것은 함수, 유형이 아닙니다. 오류가 발생합니다

let fn = 'hello';
new fn;

오류 발생:

Uncaught TypeError: fn은 생성자가 아닙니다
객체에 존재하지 않는 메서드 호출

let obj = {};
obj.fn()

오류 발생:

Uncaught TypeError: obj.fn은 a가 아닙니다. function
물론 함수 유형을 캡슐화할 때 전달된 매개변수를 강제로 지정할 수도 있습니다. 그렇지 않으면 유형 오류가 발생합니다.

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

flatten('test');

수신 매개변수가 배열이 아닌 경우 다음과 같은 사용자 정의 유형 오류가 발생합니다.

Uncaught TypeError: 수신 매개변수가 배열이 아닙니다

ReferenceError

잘못된 참조입니다.

존재하지 않는 변수를 참조했습니다

console.log(a);

오류 발생

Uncaught ReferenceError: a가 정의되지 않았습니다.
할당할 수 없는 데이터에 변수를 할당합니다
이 실수는 메소드를 호출한 후 if 문에서 자주 발생합니다. 판단을 내리면 비교 연산자 ==는 할당 연산자 =로 작성됩니다. 예를 들어 문자열의 첫 번째 문자가 지정된 문자인지 판단하려면

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

오류가 발생합니다.

Uncaught ReferenceError: Invalid left-hand 할당 중
RangeError
값이 유효한 범위를 벗어났습니다. 일부 메서드에서는 전달된 값이 특정 범위 내에 있어야 합니다. 그렇지 않으면 범위를 벗어난 오류가 발생합니다.
배열 생성 시 전달된 길이가 0

let arr = new Array(-1)

오류 발생:

Uncaught RangeError: 잘못된 배열 길이
repeat 메소드가 지정된 문자열을 반복하고 반복 횟수가 0

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

미만이면 오류가 발생합니다. :

Uncaught RangeError: 잘못된 카운트 값

URIError

URI 인코딩 처리 중 오류가 발생했습니다. 함수 매개변수가 올바르지 않습니다. 주로 6개 함수인 encodeURI(), decodeURI(), encodeURIComponent(), decodeURIComponent(), escape() 및 unescape()입니다.
예:

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

오류 발생:

Uncaught URIError: URI Malformed

사용자 정의 오류 유형

때때로 오류 유형을 사용자 정의하려면 생성자를 사용자 정의한 다음 프로토타입 상속이 오류를 상속하도록 해야 합니다. 프로토타입 .

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 (0c3d1a8a9fac89c933e63fe9a97ef2f1:3:14)
  at b (0c3d1a8a9fac89c933e63fe9a97ef2f1:10:6)
  at a (0c3d1a8a9fac89c933e63fe9a97ef2f1:13:6)
  at 0c3d1a8a9fac89c933e63fe9a97ef2f1:15:4
以上为抛错的构造函数的总结，如有误之处欢迎扶正。

위 내용은 JavaScript 오류 처리 메커니즘 소개(예제 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!