어떠한 이유로 프로그램 실행 중 오류가 발생할 수 있는데 이 오류를 위한 적절한 대책을 세우는 것을 '예외 처리'라고 합니다. 프로그램 실행 중에 발생하는 경우이므로 사용자를 생각해 적절히 대응할 수 있는 방안을 마련해 두는 것입니다. 참고로 예외와 오류는 다른데 오류는 잘못된 문법이나 오타 등으로 인해 아예 프로그램이 실행되지 않는 경우를 말합니다.
javascript에서는 예외를 처리하는 방법으로 try ~ catch ~ finally를 사용할 수 있습니다. try 안에는 실행할 구문을 작성하며 catch안에는 예외발생시 실행할 구문을 작성합니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title></title>
<script>
var span_msg = function () {
alert('안녕하세요.');
};
window.onload = function() {
try {
var o = document.getElementById('myspan');
o.addEventListener('click', span_msg);
}
catch (ex) {
alert('예외 !!');
}
};
</script>
</head>
<body>
<span>cliel.com</span>
</body>
</html>위 예제에서는 id가 myspan이라는 요소를 가져와 click이벤트에 span_msg메서드를 연결하고자 하는 시도를 하고 있습니다. 하지만 문서 안에서는 id가 myspan이라는 요소는 존재하지 않으며 따라서 try실행 중 catch로 실행 부분이 옮겨지게 되어 '예외!!'라는 메시지를 출력할 것입니다.
finally부분은 옵션으로 있어도 되고 없어도 되는 부분입니다. 만약 finally가 존재한다면 예외가 발생하든 발생하지 않든 finally에 들어간 코드는 무조건 실행합니다.
var span_msg = function () {
alert('안녕하세요.');
};
window.onload = function() {
try {
var o = document.getElementById('myspan');
o.addEventListener('click', span_msg);
}
catch (ex) {
alert('예외 !!');
}
finally {
alert('실행됨');
}
};finally사용시 주의해야 할 점이 있는데 catch내부에서 return을 사용한다고 하더라도 무조건 finally는 실행된다는 점입니다. 의도하지 않는 동작을 할 수 있으므로 알아두시기 바랍니다.
catch를 보면 ex라는 부분이 보이는데 이를 예외 객체라고 합니다. 필요한 경우 예외 객체를 통해 예외에 관한 여러 가지 정보를 알아낼 수 있습니다. 브라우저마다 조금씩 사용할 수 있는 속성이 다르지만 다음과 같은 공통적인 속성은 공통적으로 사용할 수 있습니다.
| message | 예외 내용 |
| description | 예외 설명 |
| name | 예외 이름 |
var span_msg = function () {
alert('안녕하세요.');
};
window.onload = function() {
try {
var o = document.getElementById('myspan');
o.addEventListener('click', span_msg);
}
catch (ex) {
alert(ex.name + '-' + ex.description);
}
finally {
alert('실행됨');
}
};흔하지는 않지만 필요한 경우 에외를 임의로 발생시킬 필요가 있습니다. 이런 경우에는 throw키워드를 사용합니다.
window.onload = function() {
try {
throw '예외 발생!';
}
catch (ex) {
alert(ex);
}
finally {
alert('실행됨');
}
};
'Web > Javascript' 카테고리의 다른 글
| [javascript] 쿠키(Cookies) (0) | 2020.07.04 |
|---|---|
| [javascript / jQuery] 크로스 도메인 (0) | 2020.07.03 |
| [javascript] 이벤트 처리 (0) | 2020.05.29 |
| [javascript] 문서 객체 다루기 (0) | 2020.05.27 |
| [javascript] 브라우저 관련 객체 (0) | 2020.05.26 |