JavaScript 고급 프로그래밍 오류 처리 및 디버깅 연구 노트_Javascript 기술

14장 오류 처리 및 디버깅
1. 브라우저 오류 보고 켜기
1.1 Internet Explorer
□Toos → 인터넷 옵션 → 고급 → 모든 스크립트 오류에 대한 알림 표시
1.2 Firefox
□도구 → 오류 콘솔(Firebug)
1.3 Safari
□편집 → 환경 설정 → 고급 → 메뉴 표시줄에 개발 메뉴 표시/Develop → 오류 콘솔 표시
1.4 Opera
□도구 → 고급 → 오류 콘솔
1.5 Chrome
□이 페이지 제어 → 개발자 → JavaScript 콘솔
2. 오류 처리
2.1 Try-catch 문
try{
//오류가 발생할 수 있는 코드
}catch( error){
//에러 발생 시 처리 방법
}
□에러가 발생하면 catch는 오류 정보가 포함된 객체를 복구합니다. 모든 브라우저와 호환되는 메시지 속성이 있습니다.
2.1.1 finally 절
try-catch 절은 선택 사항입니다. finally 절을 사용하면 해당 코드가 실행됩니다.
2.1.2 오류 유형
□오류: 기본 유형. 주요 목적은 개발자가 사용자 정의 오류를 발생시키는 것입니다.
□EvalError: eval() 함수를 사용하여 예외가 발생하면 발생합니다.
□RangeError: 값이 해당 범위를 초과할 때 발생합니다.
□ReferenceError: 개체를 찾을 수 없는 경우
□SyntaxError: 구문 오류가 있는 JavaScript 문자열을 eval() 함수에 전달합니다.
□TypeError: 예기치 않은 유형이 변수에 저장되거나 존재하지 않는 메소드에 액세스하는 경우.
□URIError: encodeURI() 또는 decodeURI()를 사용하고 URI 형식이 잘못된 경우.
다양한 오류 유형에 따라 오류 처리를 수행합니다.
try{
soemFunction()
}catch(error){
if(error instanceof TypeError){
//processing Type error
}else if(error instanceof ReferenceError){
//참조 오류 처리
}else{
//기타 유형 오류 처리
}
}
2.1. try-catch를 잘 활용하세요
□try-catch 문을 사용하면 브라우저는 오류가 처리된 것으로 간주합니다.
□제어할 수 없는 오류를 잡는 데 가장 적합한 try-catch 문을 사용하세요.
□코드에 오류가 발생했다는 것을 확실히 알고 있다면 try-catch를 사용하지 말고 오류를 수정해야 합니다.
2.2 Throwing 오류
①try-catch 문과 쌍을 이루는 throw 연산자가 있습니다. throw 연산자를 만나면 코드 실행이 즉시 중지됩니다. try-catch 문이 던져진 값을 캡처하는 경우에만 코드 실행이 계속됩니다.
②throw new Error("뭔가 나쁜 일이 일어났습니다."); 또는 프로토타입 체인을 사용하여 Error를 상속하여 사용자 정의 오류 유형을 만듭니다.
2.2.1 오류 발생 타이밍
2.2.2 오류 발생 및 try-catch 사용
2.2.3 오류 이벤트
①try-catch로 처리되지 않은 오류는 오류 이벤트를 트리거합니다. 창 개체.
②모든 브라우저에서 onerror 이벤트 핸들러는 이벤트 객체를 생성하지 않습니다. 그러나 오류 메시지, 오류가 있는 URL, 줄 번호 등 3개의 매개변수를 허용합니다. (에러 메시지만 유용함)
③ DOM0 레벨 기술을 사용해야 하는 onerror 이벤트 핸들러를 지정합니다.
window.onerror = function(message,url,line){
alert(message);
return false; //false를 반환하면 이 함수는 실제로 전체 문서에 대한 try-catch 문 역할을 합니다. . 코드 없이 처리되는 모든 런타임 오류를 잡아냅니다.
};
④이미지도 오류 이벤트를 지원합니다. 이미지의 src 속성에 있는 URL이 인식된 이미지 형식을 반환할 수 없는 한 오류 이벤트가 트리거됩니다. 이때 오류 이벤트는 DOM 형식을 따르며, 해당 이미지를 대상으로 하는 이벤트 객체를 반환합니다.
3. 오류 처리 전략
3.1 일반적인 오류 유형
□유형 변환 오류
□데이터 유형 오류
□통신 오류
3.1.1 유형 변환 오류
유형 변환 값을 데이터 유형으로 자동 변환할 수 있는 연산자나 기타 언어 구성을 사용할 때 오류가 발생합니다. 유형 변환 오류는 항등(==) 및 부등호(!==) 연산자를 사용하거나 if, for, while과 같은 흐름 제어 문에서 부울이 아닌 값을 사용할 때 가장 일반적으로 발생합니다.
3.1.2 데이터 유형 오류
데이터 유형 오류는 예상치 못한 값이 함수에 전달될 때 발생할 가능성이 가장 높습니다.
3.1.3 통신 오류
①URL 형식이 잘못되었거나 전송된 데이터에 문제가 있습니다. 쿼리 문자열의 경우 encodeURIComponent() 메서드를 사용해야 합니다.
② 서버에서 응답한 데이터가 잘못된 경우에도 통신 오류가 발생할 수 있습니다.
3.2 치명적인 오류와 치명적이지 않은 오류 구별
① 치명적이지 않은 오류
□ 사용자의 주요 작업에 영향을 주지 않습니다
□ 페이지의 일부에만 영향을 줍니다
□ 복구 가능
□ 동일한 작업을 반복하면 오류가 제거될 수 있습니다
② 치명적인 오류
□ 응용 프로그램이 전혀 실행되지 않습니다
□ 오류가 사용자의 기본 작업에 명백히 영향을 미칩니다
□ 다른 관련 오류가 발생합니다
3.3 서버에 오류 기록: ( (생략)
4. 디버깅 기술
4.1 콘솔에 메시지 로깅
①IE8, Firefox, Chrome 및 Safari의 경우 다음을 통해 메시지를 JavaScript 콘솔에 쓸 수 있습니다. 콘솔 객체. 개체에는 다음과 같은 메서드가 있습니다.
□error(message): 콘솔에 오류 메시지 기록
□info(message): 콘솔에 정보 메시지 기록
□log(message): 일반 메시지 기록 the console
□warn(message): 경고 메시지를 콘솔에 기록합니다
② 또 다른 해결책은 LiveConnect를 사용하는 것인데, 이는 JavaScript에서 Java 코드를 실행하는 것입니다.
③JavaScript 콘솔에 메시지를 쓰기 위한 통일된 인터페이스:
function log(message){
if(typeof console == "object"){
console.log(message)
} else if(typeof Opera == "object"){
opera.postError(message)
}else if(typeof java == "object" && typeof java.lang == "object"){
java.lang.System.out.println(message);
}
}
4.2 현재 페이지에 메시지를 기록합니다
4.3 오류 발생
①대형 애플리케이션의 경우 즉, 사용자 정의 오류는 일반적으로 Assert() 함수를 사용하여 발생합니다. 이 함수는 두 개의 매개변수를 받습니다. 하나는 true로 평가되는 조건이고, 다른 하나는 조건이 false일 때 발생하는 오류입니다.
함수 주장(조건, 메시지){
if(!조건){
throw new Error(message)
}
}
②응용 프로그램:
함수 나누기( num1 ,num2){
assert(typeof num1 == "number"&&typeof num2== "number","divide(): 두 인수는 모두 숫자여야 합니다.")
return num1/num2;
5. 일반적인 IE 오류
□ 작업이 종료되었습니다
□ 잘못된 문자
□ 멤버를 찾을 수 없습니다
□ 알 수 없는 런타임 오류
□ 구문 오류
□ 시스템을 찾을 수 없습니다 지정 리소스