JS 오류 처리 및 디 버 깅 작업 사례 분석

본 논문 의 사례 는 JS 오류 처리 와 디 버 깅 작업 을 서술 하 였 다.여러분 께 참고 하도록 공유 하 겠 습 니 다.구체 적 으로 는 다음 과 같 습 니 다.
JavaScript 오류-throw,try,catch
try 구문 테스트 코드 블록 의 오류 입 니 다.
catch 구문 처리 오류.
throw 문 구 는 사용자 정의 오 류 를 만 듭 니 다.
finally 문 구 는 try 와 catch 문 구 를 사용 한 후에 트리거 이상 이 있 든 없 든 이 문 구 는 실 행 됩 니 다.
JavaScript try 와 catch
try 문 구 는 실행 할 때 오류 테스트 를 하 는 코드 블록 을 정의 할 수 있 습 니 다.
catch 문 구 는 try 코드 블록 에 오류 가 발생 했 을 때 실 행 된 코드 블록 을 정의 할 수 있 습 니 다.
자 바스 크 립 트 문장 try 와 catch 는 쌍 을 지어 나타난다.
문법

try { 
  ... //      
} catch(e) {
   ... //         
} finally { 
  ... //     }

예:

var txt=""; 
function message() 
{ 
  try { 
    adddlert("Welcome guest!"); 
  } catch(err) { 
    txt="       。

"; txt+=" :" + err.message + "

"; txt+=" 。

"; alert(txt); } }
finally 문장
finally 문 구 는 이전 try 와 catch 에 이상 이 있 든 없 든 이 코드 블록 을 실행 합 니 다.

<input id="demo" type="text">
<button type="button" οnclick="myFunction()">  </button>
<p id="p01"></p>
<script>
function myFunction() {
 var message, x;
 message = document.getElementById("p01");
 message.innerHTML = "";
 x = document.getElementById("demo").value;
 try { 
  if(x == "") throw "    ";
  if(isNaN(x)) throw "       ";
  x = Number(x);
  if(x > 10) throw "  ";
  if(x < 5) throw "  ";
 }
 catch(err) {
  message.innerHTML = "  : " + err + ".";
 }
 finally {
  document.getElementById("demo").value = "";
 }
}
</script>

투사 문
throw 문 구 는 사용자 정의 오 류 를 만 들 수 있 습 니 다.
정확 한 기술 용 어 는 이상(exception)을 만 들 거나 던 지 는 것 입 니 다.
throw 를 try 와 catch 와 함께 사용 하면 프로그램 흐름 을 제어 하고 사용자 정의 오류 메 시 지 를 생 성 할 수 있 습 니 다.
문법

throw exception

이상 은 JavaScript 문자열,숫자,논리 값 또는 대상 일 수 있 습 니 다.
실례
이 예 는 입력 변수의 값 을 검사 합 니 다.값 이 틀 리 면 이상(오류)을 던 집 니 다.catch 는 이 오 류 를 포착 하고 사용자 정의 오류 메 시 지 를 표시 합 니 다.

function myFunction() {
  var message, x;
  message = document.getElementById("message");
  message.innerHTML = "";
  x = document.getElementById("demo").value;
  try { 
    if(x == "") throw "   ";
    if(isNaN(x)) throw "    ";
    x = Number(x);
    if(x < 5)  throw "  ";
    if(x > 10)  throw "  ";
  }
  catch(err) {
    message.innerHTML = "  : " + err;
  }
}

자 바스 크 립 트 디 버 깅 도구
프로그램 코드 에서 오 류 를 찾 는 것 을 코드 디 버 깅 이 라 고 합 니 다.
디 버 깅 은 어렵 지만 다행히도 많은 브 라 우 저 에 디 버 깅 도구 가 내장 되 어 있다.
내 장 된 디 버 깅 도 구 는 시작 하거나 닫 을 수 있 으 며 심각 한 오류 메 시 지 는 사용자 에 게 보 냅 니 다.
디 버 깅 도구 가 있 으 면 정지점(코드 가 실행 되 지 않 는 위치)을 설정 할 수 있 고 코드 가 실 행 될 때 변 수 를 검사 할 수 있 습 니 다.
브 라 우 저 에서 디 버 깅 도 구 를 사용 하려 면 보통 F12 키 를 누 르 고 디 버 깅 메뉴 에서'Console'을 선택 하 십시오.
console.log()방법
브 라 우 저가 디 버 깅 을 지원 한다 면,console.log()방법 으로 디 버 깅 창 에 자 바스 크 립 트 값 을 인쇄 할 수 있 습 니 다.
실례

a = 5;
b = 6;
c = a + b;
console.log(c);

정지점 설정
디 버 깅 창 에서 자바 스 크 립 트 코드 의 정지점 을 설정 할 수 있 습 니 다.
모든 정지점 에서 자 바스 크 립 트 변수의 값 을 검사 할 수 있 도록 자 바스 크 립 트 코드 를 실행 하지 않 습 니 다.
검사 가 끝 난 후에 코드 를 다시 실행 할 수 있 습 니 다(예 를 들 어 재생 버튼).
debugger 키워드
debugger 키 워드 는 자바 스 크 립 트 를 실행 하지 않 고 디 버 깅 함 수 를 호출 하 는 데 사 용 됩 니 다.
이 키 워드 는 디 버 깅 도구 에서 정지점 을 설정 하 는 효과 와 같 습 니 다.
디 버 깅 이 사용 되 지 않 으 면 debugger 문 구 는 작 동 할 수 없습니다.
debugger 를 열 면 코드 가 세 번 째 줄 전에 실행 을 중단 합 니 다.
실례

var x = 15 * 5; 
debugger; 
document.getElementbyId("demo").innerHTML = x;

관심 있 는 친 구 는 온라인 HTML/CSS/JavaScript 코드 실행 도 구 를 사용 할 수 있 습 니 다.http://tools.jb51.net/code/HtmlJsRun상기 코드 실행 효 과 를 테스트 할 수 있 습 니 다.
자 바스 크 립 트 관련 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 살 펴 볼 수 있다.,,,,,,,,,,,,,,,,,,,,
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기