|
자바스크립트(Javascript) 에러와 런타임오류 다루기 |
|
개발환경 : window 7 64bit |
|
프로그램에서 에러의 종류는 3가지가 있습니다. 문법에러, 런타임오류, 논리오류가 있습니다. 어떨 때 그런 에러가 나는지 다뤄 보도록 하겠습니다. |
문법오류는 아래와 같이 컴파일 하는 동안에
발생하기 때문에 다른 스레드에는 전혀 영향을 주지
않고 해당 스레드만 문제가 생겨 아무일도
발생안한 것 처럼 보입니다.
|
<script type="text/javascript"> <!-- window.print(; //--> </script> |
런타임오류는 컴파일 후에 실행하는 동안에 발생하기
발생합니다. 이것도 다른 스레드가 정상적으로 실행
할수 있도록 해당스레드에만 영향을 미칩니다.
아래 예제는 구문에는 이상이 없는데 함수명이 틀린것이죠.
|
<script type="text/javascript"> <!-- window.printme(); //--> </script> |
논리오류는 흔히들 눈에 들어나지 않는 오류입니다.
어디서 꼬였는지 알수 없지만 논리적으로 잘못되어
결과가 예상한대로 나오지 않는 것이죠. 이런 것들은
위에서 예로 든 2가지 에러보다 찾기 힘들며
디버그 모드로 단계별로 실행하면서 많이들
찾곤 하죠.
이렇게 에러가 났을 때 프로그램 스레드가 멈추지 않고
무슨일이 일어났는지 사용자에게 알려주면 원인파악이
제대로 되므로 빠른 수습이 되겠죠.
그래서 자바스크립트에서는 try…catch..finally 문을
제공합니다. 이것은 문법에러는 잡아주지 못하고
실행(런타임)오류만 잡습니다. 문법은 아래와 같습니다.
Try 블록안에서 코드가 실행이 되며 런타임 에러가
발생하면 catch 블록안에 있는 코드가 실행이 됩니다.
그리고 finally 는 에러가 나든 안나든 무조건 실행되는
영역입니다. 보통이곳은 모든 과정을 다 끝냈을 때
종료해야 되는 코드가 들어가는데 다른 곳과 Connection
이 맺어져서 실행후 에러가 나든 안나든 무조건 종료
해야 하면 이곳에 close 관련 함수를 넣어서 정상
종료를 해야 겟죠.
|
<script type="text/javascript"> <!-- try { // 코드실행 [break;] } catch ( e ) { // 예외발생 [break;] }[ finally { // 무조건 실행 }] //--> </script> |
샘플에서 에러가 발생한다면 alert("에러 : " + e.description ); 코드가
실행이 될 것이고 아니라면 alert("Value 값 : " + a ); 실행이 되겠죠.
그리고 alert("Finally 블록 실행!" ); 코드는 무조건 실행이
될 것입니다.
|
<html> <head> <script type="text/javascript"> <!-- function myFunc() { var a = 100;
try { alert("Value 값 : " + a ); }catch ( e ) { alert("에러 : " + e.description ); }finally { alert("Finally 블록 실행!" ); } } //--> </script> </head> <body> <p>클릭하면 결과가 나타날 것임 :</p> <form> <input type="button" value="Click Me" onclick="myFunc();" /> </form> </body> </html> |
이번에는 throw 문법에 대한 설명입니다. 이것은
에러가 날만한 상황을 미연에 코드로 지정해 두고
그 상황이 왔을 때 사용자가 임의로 에러를
발생시켜 catch 문으로 보내버리는 것입니다.
예제에서는 b = 0 이므로 throw 를 사용해 바로
에러를 발생시켰는데, 이것은 나눌 때 b 가 0
이면 런타임 에러가 나기 때문에 미연에 방지
했다고 볼수 있습니다.
|
<html> <head> <script type="text/javascript"> <!-- function myFunc() { var a = 100; var b = 0;
try{ if ( b == 0 ){ throw( "에러 강제 발생 " ); }else{ var c = a / b; } }catch ( e ) { alert("Error: " + e ); } } //--> </script> </head> <body> <p>클릭하시면 결과를 볼수 있습니다 :</p> <form> <input type="button" value="Click Me" onclick="myFunc();" /> </form> </body> </html> |
다음은 onerror() 함수입니다. 자바스크립에서 에러관리를
좀더 쉽게 해주기위해 제공하는 것으로 에러가 발생하면
제일 먼저 실행이 됩니다.
메시지를 발생시키고 싶으면 아래와 같이 간단하게
Window.onerror 속성에 함수를 만들어 넣으시면 됩니다.
그럼 에러날 때 마다 똑 같은 alert 메시지가 발생하겠죠.
|
<html> <head> <script type="text/javascript"> <!-- window.onerror = function () { alert("An error occurred."); } //--> </script> </head> <body> <p>클릭하면 결과가 나타날 것임 :</p> <form> <input type="button" value="Click Me" onclick="myFunc();" /> </form> </body> </html> |
Onerror 가 발생시키는 이벤트에서는 3가지 정보를
제공해줍니다. 샘플을 실행해 보시면 아마 정확하게
알수 있을 겁니다.
l 에러메시지 : 에러정보를 메시지로 줍니다.
l URL : 발생한 소스의 파일명을 리턴해줍니다.
l Line : 발생한 에러 줄번호를 알려줍니다.
|
<html> <head> <script type="text/javascript"> <!-- window.onerror = function (msg, url, line) { alert("Message : " + msg ); alert("url : " + url ); alert("Line number : " + line ); } //--> </script> </head> <body> <p>클릭하면 결과가 나타날 것임:</p> <form> <input type="button" value="Click Me" onclick="myFunc();" /> </form> </body> </html> |
'웹 프로그래밍 > 자바스크립트' 카테고리의 다른 글
| 자바스크립트(Javascript) 문자열 자르기 위한 함수 Split (0) | 2015.01.02 |
|---|---|
| 자바스크립트(Javascript) 멀티미디어 이용하기 (0) | 2014.12.30 |
| 자바스크립트(Javascript) 애니메니션 이용하기 (3) | 2014.11.18 |
| 자바스크립트(Javascript) 폼(Form) 에 입력된 값의 유효성 체크 (0) | 2014.11.15 |
| 자바스크립트(Javascript) Objects 객체의 사용법 (0) | 2014.10.15 |
| 자바스크립트(Javascript) print 함수를 이용해 웹페이지 인쇄하기 (0) | 2014.10.14 |
| 자바스크립트(Javascript) 라벨기능을 사용하여 반복문의 흐름 제어하기 (0) | 2014.09.29 |
| 자바스크립트(Javascript) IF… Else 구분 사용하기 (0) | 2014.09.22 |
