일하고 공부하고

JavaScript 기초: 에러 처리 본문

코딩/자바스크립트

JavaScript 기초: 에러 처리

회사원짱구 2024. 12. 18. 11:58
반응형
JavaScript 기초: 에러 처리

JavaScript 기초: 에러 처리

JavaScript 코드를 작성하다 보면 오류(에러)가 발생할 수 있습니다. 이번 포스팅에서는 에러의 종류와 에러를 처리하는 방법, 그리고 디버깅 팁을 살펴보겠습니다.

1. 에러의 종류

  • 구문 에러(Syntax Error): 문법이 잘못된 경우 발생.
  • 참조 에러(Reference Error): 존재하지 않는 변수나 값을 참조할 때 발생.
  • 타입 에러(Type Error): 값의 타입이 올바르지 않을 때 발생.

// Syntax Error
// console.log("Hello // 따옴표가 닫히지 않아 발생

// Reference Error
console.log(notDefinedVariable); // 정의되지 않은 변수를 참조

// Type Error
const num = 123;
num.toUpperCase(); // 숫자에는 toUpperCase() 메서드가 없음

2. try-catch 구문

try-catch 구문은 코드 실행 중 발생하는 에러를 처리하는 데 사용됩니다.


try {
    // 에러가 발생할 가능성이 있는 코드
    const result = 10 / 0; // 정상 실행
    console.log(result);
    const undefinedVar = notDefined; // Reference Error 발생
} catch (error) {
    // 에러를 처리
    console.log("에러 발생:", error.message);
} finally {
    // 에러 발생 여부와 상관없이 실행
    console.log("try-catch 블록이 종료되었습니다.");
}

3. throw 키워드

직접 에러를 발생시키고 싶을 때 throw 키워드를 사용할 수 있습니다. 주로 커스텀 에러를 만들 때 유용합니다.


function checkPositive(number) {
    if (number < 0) {
        throw new Error("음수는 허용되지 않습니다.");
    }
    return "양수입니다!";
}

try {
    console.log(checkPositive(5)); // "양수입니다!"
    console.log(checkPositive(-3)); // 에러 발생
} catch (error) {
    console.log("에러 처리:", error.message);
}

4. 디버깅 팁

  • 콘솔 로그: console.log()를 사용하여 변수의 값과 흐름을 추적.
  • 브라우저 디버거: Chrome, Firefox 등의 디버거를 이용하여 중단점(Breakpoint) 설정.
  • 에러 메시지 분석: 에러 메시지를 자세히 읽어 원인을 파악.

5. 실습 과제

실습 과제

1. try-catch 구문을 사용하여 에러가 발생했을 때 "에러가 발생했습니다."를 출력하세요.

2. throw 키워드를 사용하여 특정 조건에서 커스텀 에러를 발생시키는 함수를 작성하세요.

정답 확인 👇

더보기

// 실습 1
try {
    const result = 10 / undefinedVar; // Reference Error 발생
} catch (error) {
    console.log("에러가 발생했습니다."); // "에러가 발생했습니다."
}

// 실습 2
function validateAge(age) {
    if (age < 0) {
        throw new Error("나이는 음수가 될 수 없습니다.");
    }
    return "나이가 정상입니다.";
}

try {
    console.log(validateAge(25)); // "나이가 정상입니다."
    console.log(validateAge(-5)); // 에러 발생
} catch (error) {
    console.log("에러 처리:", error.message); // "에러 처리: 나이는 음수가 될 수 없습니다."
}

            

이번 포스팅에서는 JavaScript의 에러 처리 방법을 배웠습니다. 여기까지 잘 따라 오셨다면 JavaScript의 기본적인 사용 방법을 이해하고, 에러 상황에서도 문제를 해결할 수 있는 수준에 도달합니다.

반응형