[Basic] JS - Errors - Throw and Try to Catch (에러 처리 구문)

목차

1. try ... catch 구문  ※ JS 에러 처리 방식
2. throw 구문
3. Error Name 속성값 종류 (6가지)

 

※ 구문 정의. 

 

try 문 : 코드 블럭에서 에러 테스트.

catch 문 : 오류 처리 가능.

throw 문 : 사용자 정의 오류 생성 가능.

finally 문 : 결과에 관계없이 시도 후 catch 코드 실행 가능.

 

 

try ... catch 구문

 

try {

  테스트 할 코드 블럭

}

catch(err) {

  에러를 다룰 코드 블럭

}

 

---

[예제]

 

<p id="demo"></p>

<script>

try {

  aLert("홈짱닷컴 Homzzang.com");

}

catch(err) {

  document.getElementById("demo").innerHTML = err.message;

}

</script>

 

결과보기 (결과값: aLert is not defined)

※ alert 아닌 aLert 이라고 입력해 에러 발생.

 

※ JS 에러 처리 방식

 

1.

일반적으로 에러 발생 시, 멈춘 후 에러 메세지 출력.

JavaScript will throw an exception (throw an error).

 

2.

JS는 2가지 속성으로 구성된 Error 객체를 생성.

name : 에러 이름. ※ 오류 이름 (설정/반환)에 사용.

message : 에러 내용. ※ 오류 내용 (설정/반환)에 사용.

 

 

throw 구문

 

1.

사용자 정의 에러 구문 정의.

(예제)

if(x > 1000) throw "Too Big";  //  text 내밷기

throw 300;  // number 내밷기

 

2.

try..catch...문과 함께 사용 가능. (아래 예제 참고)

---

[예제]

 

<input id="num" type="text" placeholder="1 ~ 10 가능">

<button type="button" onclick="homzzang()">클릭</button>

<p id="message"></p>

<script>

function homzzang() {

  var message, x;

  

  msg = document.getElementById("message");

  msg.innerHTML = "";

  

  x = document.getElementById("num").value;

  try { 

    if(x == "")  throw "없음.";

    if(isNaN(x)) throw "숫자 아님."; 

    x = Number(x);

    if(x > 10)   throw "너무 큼.";

    if(x < 1)  throw "너무 작음.";

  }

  catch(err) {

    msg.innerHTML = "입력값 : " + err;

  }

  finally {

    document.getElementById("demo").value = "";

  }

}

</script>

 

결과보기

 

 

Error Name 속성값 종류 (6가지)

※ Error 객체의 name 속성에 의해 반환되는 값 종류임.

 

EvalError:  eval() 함수에서 오류 발생. (JS 새 버전에선 비사용. 대신, SyntaxError 사용.)

RangeError  :  "범위 벗어난" 숫자.

ReferenceError  :  잘못된 참조.

SyntaxError  :  구문 오류.

TypeError  :  유형 오류.

URIError  :  encodeURI () 오류.

 

※ 그외 비표준 Error 객체 속성 존재.