• 회원가입
  • 로그인
  • 구글아이디로 로그인

[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 객체 속성 존재.


방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Common Mistakes -
Basic JS - Performance -
Basic JS - Reserved Words -
Basic JS - Versions -
Basic JS - JSON (제이슨) - 데이터 전송 위한 가벼운 자료 형식.
Form JS - Forms - 폼양식 유효성 제어
Form JS - Forms API - 폼유효성
Object JS - Object - 객체개념(=객체의미=객체정의) ★ 3
Object JS - Object Property - 객체속성 ★
Object JS - Object Methods - 객체메서드 ★
Object JS - Object Accessors - 객체접근자 (Getter/Setter = 게러/세러 = 게터/세터… 2
Functions JS - Function Definition - 함수선언방법 + 함수호출방법 ★★★ (= 함수구문 + 함수특…
Functions JS - Function Parameter/argument - 함수 (매개변수/독립변수) ※ 변수 종류 ※ …
Functions JS - Function Invocation - 함수호출방법1 = (함수방식 + 메서드방식 + 함수생성자방…
Functions JS - call() 메서드 - 함수호출방법2 (= call메서드 = 콜메서드)
DOM JS - DOM (= 돔 = 문서객체모델) 정의
DOM JS - Method - 메서드 (= HTML 요소에 대한 수행 작업)
DOM JS - Document - 문서객체
DOM JS - Element Selector - 주요 요소선택자 (= 객체찾기) ※ JS외부링크호출 주의사항
DOM JS - HTML - 내용입력/내용변경/속성값변경(=속성값입력)
3/67
목록
찾아주셔서 감사합니다. Since 2012