자바스크립트 - 오류 및 예외 처리
안녕하세요, 미래의 자바스크립트 마법사 여러분! ? 우리가 자바스크립트의 오류 처리 세계로 떠나는 흥미로운 여정에 환영합니다. 여러분의 친절한 이웃 컴퓨터 선생님으로서, 저는 이 모험을 안내해드리겠습니다. 그러니 안전벨트를 채우고, 함께 빠져보겠습니다!
오류란 무엇인가요?
상상해보세요, 케이크를 만들 때 ?, 실수로 소금 대신 설탕을 사용하는 경우. 그것이 오류입니다! 프로그래밍에서 오류는 비슷합니다 - 코드가 실행될 때 발생하는 예상치 못한 문제입니다. 이것은 타이포, 논리적 실수, 또는 사용하는 데이터에 문제가 있을 수 있습니다.
여기 자바스크립트에서 오류의 간단한 예제가 있습니다:
console.log(Hello, World!);이 코드를 실행하면 오류가 발생합니다.因为我们忘记了在文本周围加上引号。 자바스크립트는 문자열이引号로 감싸여 있기를 기대합니다.
오류 처리란 무엇인가요?
오류 처리는 타 tightrope를 걸을 때의 안전망과 같습니다. 코드에서 오류를 부드럽게 관리하여, 무언가가 잘못되었을 때 전체 프로그램이崩溃하는 것을 방지하는 방법입니다.
try...catch...finally 문
try...catch...finally 문은 자바스크립트에서 오류를 처리하는 주요 도구입니다. 마치 슈퍼히어로 트리오가 구조에 오는 것처럼! ?♀️?♂️?♀️
다음과 같이 작동합니다:
try {
// 오류를 유발할 수 있는 코드
let result = 10 / 0;
console.log(result);
} catch (error) {
// 오류를 처리하는 코드
console.log("Oops! An error occurred:", error.message);
} finally {
// 오류가 발생했든 안 발생했든 항상 실행되는 코드
console.log("This always runs!");
}이 예제에서:
-
try블록은 오류를 유발할 수 있는 코드를 포함합니다 (0으로 나누기). - 오류가 발생하면
catch블록이 그것을 잡아 부드럽게 처리합니다. -
finally블록은 오류가 발생했든 안 발생했든 항상 실행됩니다.
throw 문
때로는 우리 자신이 커스텀 오류를 생성하고 싶을 때가 있습니다. 그때 throw 문이 유용하게 쓰입니다. 마치 경기에서 심판이 페널티를 부르는 것처럼! ?
다음은 예제입니다:
function checkAge(age) {
if (age < 0) {
throw new Error("Age cannot be negative!");
}
console.log("Age is valid:", age);
}
try {
checkAge(-5);
} catch (error) {
console.log("Caught an error:", error.message);
}이 코드에서는 음수 연령을 사용하려고 시도할 때 커스텀 오류를 던집니다. catch 블록은 이 오류를 처리합니다.
onerror 이벤트 핸들러 속성
onerror 이벤트 핸들러는 여러분의 전체 자바스크립트 애플리케이션을 지키는 깨어 있는 보호자와 같습니다. 코드 어디서 발생한 오류를 잡습니다.
다음과 같이 사용할 수 있습니다:
window.onerror = function(message, source, lineno, colno, error) {
console.log("An error occurred:");
console.log("Message:", message);
console.log("Source:", source);
console.log("Line:", lineno);
console.log("Column:", colno);
console.log("Error object:", error);
return true;
};
// 이 코드는 onerror 핸들러를 트리거합니다
nonExistentFunction();이 코드는 전역 오류 핸들러를 설정하여 애플리케이션 내에서 발생한 모든未捕捉 오류를 잡습니다.
자바스크립트 오류 객체 참조
자바스크립트는 여러 가지 내장된 오류 유형을 제공합니다. 이를 간단한 표로 정리해보겠습니다:
| 오류 유형 | 설명 |
|---|---|
| Error | 일반 오류 유형 |
| SyntaxError | 코드에 문법 오류가 있을 때 발생 |
| ReferenceError | 존재하지 않는 변수를 참조할 때 발생 |
| TypeError | 값이 기대하는 유형과 다를 때 발생 |
| RangeError | 숫자가 허용 범위 밖에 있을 때 발생 |
| URIError | 잘못된 URI 함수를 사용할 때 발생 |
| EvalError |
eval() 함수와 관련된 오류가 발생 |
다음은 이러한 오류들이 어떻게 발생할 수 있는 예제입니다:
try {
// SyntaxError
eval("Hello World");
// ReferenceError
console.log(undefinedVariable);
// TypeError
null.f();
// RangeError
let arr = new Array(-1);
// URIError
decodeURIComponent("%");
} catch (error) {
console.log(error.name + ": " + error.message);
}이 각 줄은 다른 유형의 오류를 발생시키며, catch 블록이 이를 처리합니다.
그렇습니다, 제 사랑하는 학생들이여! 우리는 자바스크립트 오류 처리의 땅을 여행했습니다. 오류는 적이 아닙니다 - 코드를 개선하는 데 유용한 피드백입니다. 이를 받아들이고 배우며, 곧 오류를 처리하는 프로가 될 것입니다! ?
계속 코딩하고, 배우고, 그 과정에서 즐겁게 하세요! 다음 수업에서 뵙겠습니다! ?
Credits: Image by storyset