자바스크립트 try catch 예외처리 가 필요한 이유는, 어떠한 프로그램도 에러 하나 없이 작성되는 것은 쉽지 않기 때문에 경험적으로 발생 가능성이 있는 코드내용에 대해 안정적으로 작성하기 위함입니다.
즉, 예상치 못했던 사용자의 잘못된 값이나, 인터넷 통신의 오류 등 일반적인 상황에서는 발생하지 않지만 어떠한 이유로 발생을 하여 작성한 코드가 에러로 인하여 중간에 멈추지 않도록 처리를 해야 합니다.
그래서 일반적으로 if else 구문으로 발생 가능성이 있는 곳을 예외 처리하지만, 코드를 작성하는 사람이 모든 에러를 예측하고 또 모든 코드를 구현하기도 현실적으로 쉽지 않습니다.
이럴 때에는 예외는 발생하였으나 코드의 중단으로 인해 앱 자체가 크래쉬되는 상황을 막고자 할 때 try , catch 그리고 finally 구문을 사용합니다.
기본적인 자바스크립트 try catch 구문
try 구문안에 기술된 코드 중 일부에서 예외 에러가 발생하면 catch 로 던져 잡겠다는 의미입니다.
try{
// 일반 로직
}catch( error ){
console.log( error ); // 발생한 예외의 특성을 갖게 되는 객체
// 예외 에러가 발생했을 때 실행될 내용
}
예외가 발생하게 되면 error 객체에 해당 예외에 대한 정보가 담겨 있습니다.
일반적으로 아래처럼 오타가 난 경우, run-time시 해당 코드가 실행이 되어야만 예외를 볼 수 있기 때문에 종종 나는 예외입니다..
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h1 id="h1tag1"></h1>
<script>
try {
// 오타로 인해 객체 id를 잘못 입력해서 객체를 가져 오지 못함
const h1tag = document.querySelector( "#h1tg1" );
h1tag.style.color = "red";
} catch (e) {
console.log( "catch-error 발생" );
console.log( e.name );
console.log( e.message );
}
</script>
</body>
</html>
오타로 인해 참조할 수 없는 객체의 style을 바꾸고자 하여 예외가 발생하였고, 그 즉시 catch 문으로 이동하여 실행됩니다.
그리고 catch 의 매개변수를 통해 받게 되는 error 변수를 통해 에러의 이름, 메시지 등이 정보를 확인할 수 있습니다.
finally 구문으로 무조건 실행하기
try catch 문과 함께 finally 구문이 사용될 수 있으며, finally는 try 구문 내에서 에러가 발생해도, 안해도 무조건 실행되게 됩니다.
<script>
try {
// 오타로 인해 객체 id를 잘못 입력해서 객체를 가져 오지 못함
const h1tag = document.querySelector( "#h1tg1" );
h1tag.style.color = "red";
} catch (e) {
console.log( "catch-error 발생" );
console.log( e.name );
console.log( e.message );
} finally{
// finally를 사용해서 에러가 발생할 때와 안할 때 모두 실행
console.log("무조건 실행되는 라인")
}
</script>
자바스크립트 try catch 에서 throw 문으로 강제 예외 처리
throw 구문을 사용하면 try 구문 안에 특정 조건에서 강제로 예외를 발생시킬 수 있습니다.
<script>
number = -1
try {
if (number > 0) {
throw "0보다 큰 값";
} else if ( number < 0) {
throw "0보다 작은 값";
}
} catch ( err ) {
//err에는 throw의 내용이 들어옴
console.log( err )
}
</script>
이상으로 자바스크립트 try, catch, finally, throw 등을 알아보았습니다. 상세한 내용은 모질라 자바스크립트 이 문서에서 참조하시면 될 것 같습니다.
주로 예외가 발생할 수 있는 undefined에 대한 내용을 알고자 한다면 이 글을 참고해 보시기 바랍니다.