예외처리란JavaScript에서 코드 실행 중에 정상적인 문법인데도 불구하고 예기치 못한 에러가 발생했을 때, 이때 코드의 실행 흐름을 복구할 수 있는 기능을 얘기한다.
- try{예외 발생되는 코드}catch{예외처리 코드}finally{예외가 발생하지 않아도 무조건 실행되는 코드};
예외처리 객체
예외에 대한 로직을 처리하면서 예외 객체를 사용하여 예외가 발생했을 때 뜨는 예외명(name), 예외설명(description), 예외메시지(message)의 값을 가져올 수 있다.
오류 유형
execption.name 기준으로 오류 유형을 잡아낼 수 있다.
오류 유형 | 설명 |
EvalError | 전역함수eval()에서 발생하는 오류 |
RangeError | 숫자변수나 매개변수가 유효한범위를 벗어났음을 나타내는 오류 |
ReferenceError | 잘못된 참조를 했음을 나타내는 오류 |
SynraxError | eval()이 코드를 분석하는 중 잘못된 구문을 만났음을 나타내는 오류 |
TypeError | 변수나 매개변수가 유효한 자료형이 아님을 나타내는 오류 |
아래와 같이 문법적으로는 문제가 없으나, 만약 숫자가 0이 아닌 다른 숫자를 받게 되면 <p>가 한 개 밖에 없어 에러가 발생한다. 예외처리를 하기 전과 예외 객체를 사용하여 예외처리를 했을 때의 다른 점을 발견할 수 있다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>반갑습니다.</p>
<p>오랜만에 뵙습니다.</p>
<script>
try {
let num = prompt("숫자를 입력해주세요");
const p = document.getElementsByTagName("p")[num];
console.log(p.textContent);
}catch(e){
if(e.name == 'TypeError'){
console.log("숫자를 0~1 사이를 작성해주세요.")
}
}finally{
console.log(`예외처리 끝`);
}
</script>
</body>
</html>
'Frontend > JavaScript' 카테고리의 다른 글
JavaScript 내장함수 : String관련 내장함수 (0) | 2024.08.04 |
---|---|
JavaScript 내장함수 : 숫자 관련 내장함수 (0) | 2024.08.04 |
JavaScript 내장함수 : 인코딩 / 디코딩 함수 (0) | 2024.08.04 |
JavaScript의 내장함수 : 타이머함수 (0) | 2024.08.04 |
JavaScript : DOM 변화 감지하기 - MutationObserver (0) | 2024.08.02 |
JavaScript : 웹 컴포넌트(Web Component)란? (0) | 2024.07.31 |
JavaScript: Date 객체에 대해서 (0) | 2024.07.31 |
JavaScript : DOM 요소의 높이 / 너비를 알아보자(client / offset / scroll / getBoundingClientRect()) (0) | 2024.07.30 |