onerror 이벤트 핸들러는 JavaScript에서 오류 처리를 지원하기 위해 처음으로 도입된 기능입니다. 페이지에서 예외(exception)가 발생할 때마다 window 객체에서 error 이벤트가 자동으로 트리거됩니다.
onerror() 메서드의 동작 방식
window.onerror에 함수를 할당해 두면, 스크립트 실행 중 런타임 오류가 발생하는 순간 해당 함수가 호출됩니다. 이를 활용하면 사용자에게 오류 알림을 표시하거나, 오류 정보를 서버로 전송해 로그를 수집하는 등의 후속 처리를 할 수 있습니다.
onerror 핸들러에는 일반적으로 다음과 같은 인수가 전달됩니다.
- 오류 메시지 : 발생한 오류에 대한 설명
- URL : 오류가 발생한 파일의 주소
- 줄 번호 : 오류가 발생한 코드의 행 위치
예제
아래 코드를 실행하여 JavaScript에서 onerror() 메서드를 구현하는 방법을 직접 확인해 보세요 −
<html>
<head>
<script>
<!--
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>
예제 설명
위 예제에서는 window.onerror에 익명 함수를 할당했습니다. 버튼을 클릭하면 정의되지 않은 myFunc() 함수가 호출되면서 오류가 발생하고, 이 순간 onerror 핸들러가 실행되어 "An error occurred."라는 경고 창이 화면에 나타납니다. 이처럼 onerror를 사용하면 별도의 try-catch 문 없이도 페이지 전체에서 발생하는 오류를 감지하고 대응할 수 있습니다.