j37. 자바스크립트 에러 처리

자바스크립트 에러 처리

try 문은 코드 블록에 에러 (errors) 가 있는지 테스트 하게 합니다.

catch 문은 에러를 처리할 수 있게 합니다.

throw 문은 사용자 정의 에러 (custom errors) 를 생성하게 합니다.

finally 문은 try ... catch 의 결과에 상관없이, 항상 실행되어야 하는 코드를 정의 합니다.

---

자바스크립트 코드를 실행할 때 다양한 에러가 발생할 수 있습니다.

에러는 프로그래머가 만든 코딩 에러일 수도 있고, 잘못된 입력값에 기인하거나, 다른 예측할 수 없는 것에 의해 발생할 수도 있습니다.

try 블록 안에 어떤 에러가 있다면, catch 블록에서 그 에러를 잡아내고 처리하기 위한 코드를 실행합니다.

---

try 문은 코드가 실행되는 동안에 에러가 있는지 여부를 테스트할 코드 블록을 정의하도록 해 줍니다.

catch 문은 try 블록 내에서 에러가 발생 할 때, 실행될 코드 블록을 정의하도록 해 줍니다.

자바스크립트 try 와 catch 문은 쌍으로 구성됩니다.

try {
    테스트할 코드 블록;
}
catch(err) {
    에러를 처리하기 위한 코드 블록;
}

---

에러가 발생하면, 자바스크립트는 일반적으로 중지하고, 에러 메시지를 생성합니다.

이것을 기술적으로는 이것을 예외 처리 (exception handling) 되었다고 합니다.

---

throw 문은 사용자 정의 에러 (a custom error) 를 생성할 수 있게 해줍니다.

예외 처리는 자바스크립트 문자열 (String) 로 할수도 있고, 숫자, 불리언 또는 객체로도 할 수 있습니다.

try ... catch 와 함께 throw 문을 사용하면, 프로그램의 흐름을 통제하고, 사용자 정의 에러 메시지를 생성할 수 있게 됩니다.

---

input 태그의 입력 값을 조사해서, 값이 틀리면, 예외 처리 exception (err) 를 던집니다.

이때 예외 처리 exception (err) 는 catch 문에서 발견되어 사용자 정의 에러 메시지를 띄워주게 됩니다.

---

finally 문은 try ... catch 문의 결과에 관계없이, 항상 실행되어야 할 코드들을 정의하게 해 줍니다.

try {
    try 코드 블록;
}
catch(err) {
    에러를 처리하기 위한 코드 블록;
} 
finally {
    try ... catch 의 결과에 관계없이 실행되어야 할 코드 블록;
}

---

전화번호 끝자리 4자리를 입력해 주세요.

<p>전화번호 끝자리 4자리를 입력해 주세요.</p>

<input id="finallyInput" type="text">
<button type="button" onclick="myFinallyFunction()">전화번호 끝 4자리 점검</button>

<p id="finallyMessage1"></p>
<p id="finallyMessage2"></p>

<script>
function myFinallyFunction() {
var myMessage, myValue;
myMessage = document.getElementById("finallyMessage1");
myMessage.innerHTML = "";
myValue = document.getElementById("finallyInput").value;
try {
if(myValue == "") throw "값이 비었습니다.";
if(isNaN(myValue)) throw "숫자가 아닌 값이 입력되었습니다.";
myValue = Number(myValue);
if(myValue > 9999 | myValue < 1000) throw "숫자 4자리를 입력해 주세요.";
}
catch(myErr) {
myMessage.innerHTML = "입력란에 " + myErr;
}
finally {
document.getElementById("finallyMessage2").innerHTML = "진짜 입력되는 것은 아닙니다.";
}
}
</script>

---

[광고] Udemy 동영상 강의로 보기