JavaScript_기본 지식에서 예외 처리 방법을 자세히 설명합니다.-JS 튜토리얼-php.cn

JavaScript_기본 지식에서 예외 처리 방법을 자세히 설명합니다.

WBOY

풀어 주다： 2016-05-16 15:54:31

원래의

1168명이 탐색했습니다.

프로그래밍 오류에는 세 가지 유형이 있습니다. (1) 구문 오류 및 (2) 런타임 오류 (3) 논리 오류:
구문 오류:

구문 분석 오류라고도 하는 구문 오류는 기존 프로그래밍 언어를 컴파일할 때 발생하며 JavaScript가 해석될 때 나타납니다.

예를 들어 다음 줄에는 닫는 대괄호가 없기 때문에 구문 오류가 발생합니다.

<script type="text/javascript">
<!--
window.print(;
//-->
</script>

로그인 후 복사

JavaScript에서 구문 오류가 발생하면 동일한 스레드에 포함된 구문 오류만 영향을 받고 다른 스레드의 코드는 실행되며 오류가 포함된 코드에 의존하는 코드는 실행되지 않습니다.
런타임 오류:

런타임 시 실행(컴파일/해석 후) 오류(예외라고도 함)가 발생합니다.

예를 들어, 다음 줄은 여기에 있는 구문이 정확하지만 런타임에 존재하지 않는 메서드를 호출하려고 하기 때문에 런타임 오류를 발생시킵니다.

<script type="text/javascript">
<!--
window.printme();
//-->
</script>

로그인 후 복사

예외는 발생한 스레드에도 영향을 미치므로 다른 JavaScript 스레드가 정상적으로 계속 실행될 수 있습니다.
논리 오류:

논리 오류는 아마도 추적하기 가장 어려운 오류 유형일 것입니다. 이러한 오류는 구문이나 런타임 오류의 결과가 아닙니다. 반대로, 스크립트 로직을 구동하는 데 버그가 발생하면 예상한 결과를 얻지 못합니다.

비즈니스 요구 사항에 따라 어떤 유형의 논리를 사용하는지 프로그램에 따라 다르기 때문에 이러한 오류를 포착하지 못할 수도 있습니다.
try...catch...finally 문:

최신 버전의 JavaScript에 예외 처리 기능이 추가되었습니다. JavaScript는 예외를 처리하기 위해 try...catch...finally 구조와 throw 작업을 구현합니다.

프로그래머가 생성한 예외와 런타임 예외는 포착할 수 있지만 JavaScript 구문 오류는 포착할 수 없습니다.

try...catch...finally 블록 구문은 다음과 같습니다.

<script type="text/javascript">
<!--
try {
  // Code to run
  [break;]
} catch ( e ) {
  // Code to run if an exception occurs
  [break;]
}[ finally {
  // Code that is always executed regardless of 
  // an exception occurring
}]
//-->
</script>

로그인 후 복사

try 블록 뒤에는 catch 블록이나 finally 블록(또는 둘 중 하나)만 와야 합니다. try 블록에서 예외가 발생하면 해당 예외는 e에 배치되고 catch 블록이 실행됩니다. try/catch 문이 무조건 실행된 후 선택적인 finally 블록입니다.
예:

아래는 존재하지 않는 함수를 호출하여 예외를 발생시키려는 예입니다. try...catch 없이 어떻게 작동하는지 살펴보겠습니다.

<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
  var a = 100;

  alert("Value of variable a is : " + a );
 
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

이제 try ... catch를 사용하여 이 예외를 포착하고 사용자에게 친숙한 메시지를 표시해 보겠습니다. 사용자에게 이 오류를 숨기려면 이 메시지를 표시하지 않을 수도 있습니다.

<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
  var a = 100;
  
  try {
   alert("Value of variable a is : " + a );
  } catch ( e ) {
   alert("Error: " + e.description );
  }
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

finally 블록을 사용하면 try/catch 문 이후 무조건 영원히 실행될 수 있습니다. 예를 들면 다음과 같습니다.

<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
  var a = 100;
  
  try {
   alert("Value of variable a is : " + a );
  }catch ( e ) {
   alert("Error: " + e.description );
  }finally {
   alert("Finally block will always execute!" );
  }
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

throw 문:

throw 문을 사용하여 내장 예외나 사용자 정의 예외를 향상할 수 있습니다. 나중에 이러한 예외를 포착하고 적절한 조치를 취할 수 있습니다.

다음은 throw 문의 사용 예입니다.

<html>
<head>
<script type="text/javascript">
<!--
function myFunc()
{
  var a = 100;
  var b = 0;
  
  try{
   if ( b == 0 ){
     throw( "Divide by zero error." ); 
   }else{
     var c = a / b;
   }
  }catch ( e ) {
   alert("Error: " + e );
  }
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

문자열, 정수, 부울 또는 객체를 사용하여 함수에서 예외를 발생시킨 다음 위에서 수행한 것과 동일한 함수에서 예외를 포착하거나 다른 함수에서 try...catch 블록을 사용할 수 있습니다.
onerror() 구문

onerror 이벤트 핸들러는 JavaScript가 오류를 처리하는 데 도움을 주는 첫 번째 기능입니다. 오류 이벤트는 페이지에서 예외가 발생할 때마다 창 개체에서 시작됩니다. 예:

<html>
<head>
<script type="text/javascript">
<!--
window.onerror = function () {
  alert("An error occurred.");
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

onerror 이벤트 핸들러는 오류의 정확한 성격을 알아내기 위해 세 가지 정보를 제공합니다.

오류 메시지 브라우저는 해당 오류에 대해 동일한 메시지를 표시합니다
오류가 발생한 파일
오류가 발생한 URL에 표시된 줄 번호

다음은 이 정보를 추출하는 방법의 예입니다

<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>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="myFunc();" />
</form>
</body>
</html>

로그인 후 복사

정보를 추출하는 것이 더 좋다고 생각되는 방식으로 표시할 수 있습니다.

onError 메서드를 사용하면 다음과 같이 이미지를 로드할 때 문제 없이 오류 메시지를 표시할 수 있습니다.

<img src="myimage.gif"
  onerror="alert('An error occurred loading the image.')" />

로그인 후 복사

onerror를 사용하면 많은 HTML 태그에 오류가 있는 경우 해당 정보를 표시할 수 있습니다.