JavaScript의 적절한 오류 처리에 대한 안내서

키 포인트

명령문 블록을 영리하게 사용하여 예외를 효과적으로 관리하여 오류가 통화 스택까지 기포 할 수 있도록하여 디버깅 프로세스를 향상시켜 오류를보다 명확하게 표시합니다. 응용 프로그램의 여러 부분에서 쉽게 관리 및 유지 보수를 위해 오류 처리를 중앙 집중화하고 단순화하기 위해 전역 오류 처리기 (예 :

이벤트)를 구현합니다.

브라우저의 기능을 사용하여 상세한 오류 정보 (통화 스택 포함)를 기록하여 오류 진단을 개선하고 오류의 소스와 컨텍스트를 더 명확하게 이해합니다.
• 블록에서 try…catch를 사용하거나 모든 실행 컨텍스트에 적합한 글로벌 오류 핸들러를 사용하여 비동기 오류 처리 퍼즐을 수정하여 비동기 코드의 오류가 효과적으로 캡처되고 관리되도록합니다.
사용자 정의 오류 유형을 만들거나 오류 메시지를 풍부하게하여 오류 메시지를 향상시켜 특정 문제를 쉽게 식별하고 해결하고 JavaScript 코드의 전반적인 견고성을 개선 할 수 있습니다.
• window.onerror JavaScript의 오류 처리는 도전으로 가득합니다. 머피의 법칙을 따르십시오. 잘못 될 수있는 것은 잘못 될 것입니다. 이 기사는 JavaScript, Cover Trap, 모범 사례 및 비동기 코드 및 Ajax를 예제로 설명하는 오류 처리를 탐색합니다.
• 이 기사는 2017 년 6 월 8 일에 독자 의견을 다루기 위해 업데이트되었습니다. 특히, 파일 이름이 코드 스 니펫에 추가되었고, 단위 테스트가 정리되었고, 래퍼 패턴이
에 추가되었으며, CORS 및 타사 오류 처리기에 대한 섹션이 추가되었습니다.
• try…catch 나는 JavaScript의 이벤트 중심 패러다임이 언어에 풍부함을 더한다고 생각합니다. 내 브라우저를이 이벤트 중심 컴퓨터로 생각하고 오류도 예외는 아닙니다. 오류가 발생하면 특정 순간에 이벤트가 발생합니다. 이론적으로, 오류는 JavaScript의 간단한 이벤트라고 말할 수 있습니다. setTimeout 이 이상한 것을 발견하면 꽤 멋진 여행을 할 것이므로 안전 벨트를 착용하십시오. 이 기사에서는 클라이언트 측 JavaScript에만 초점을 맞출 것입니다.
이 주제는 "JavaScript의 우수한 예외 처리"에 설명 된 개념을 기반으로합니다. 익숙하지 않은 경우 기본 사항을 읽는 것이 좋습니다. 이 기사에서는 또한 귀하가 적당한 수준의 JavaScript 지식을 가지고 있다고 가정합니다. 레벨을 개선하려면 Sitepoint Premium에 가입하고 코스 JavaScript : Next? 첫 번째 수업은 무료입니다.
• 두 경우 모두 저의 목표는 예외를 다루는 것 외에 필요한 조건을 탐색하는 것입니다. 이 기사를 읽은 후 다음에 좋은
블록을 볼 때, 당신은 행동하기 전에 두 번 생각할 것입니다.

데모

이 기사에서 사용될 데모 프로그램은 Github에서 찾을 수 있으며 다음과 같이 표시됩니다.

모든 버튼은 클릭하면 "폭탄"을 폭발시킵니다. 이 폭탄은 타입 원인으로 던져진 예외를 시뮬레이션합니다. 다음은이 모듈의 정의입니다 :

먼저이 함수는 foo라는 빈 개체를 선언합니다.

는 어디에도 정의되지 않았습니다. 좋은 단위 테스트를 사용하여 폭탄이 폭발 할 것임을 확인합시다 :

// scripts/error.js

function error() {
  var foo = {};
  return foo.bar();
}

.

이 단위 테스트는 테스트 어설 션에 Mocha를 사용하고 Assertions에 js를 사용합니다. Mocha는 테스트 러너이며 JS는 어설 션 라이브러리입니다. 익숙하지 않다면 테스트 API를 자유롭게 탐색하십시오. 테스트는 로 시작하여 의 패스/실패로 끝납니다. 장치 테스트는 노드에서 실행되며 브라우저가 필요하지 않습니다. 순수한 JavaScript의 주요 개념을 증명하기 때문에 이러한 테스트에주의를 기울이는 것이 좋습니다. bar()

리포지토리를 복제하고 종속성을 설치 한 후 를 사용하여 테스트를 실행할 수 있습니다. 또는이 단일 테스트를 다음과 같이 실행할 수 있습니다.

// tests/scripts/errorTest.js

it('throws a TypeError', function () {
  should.throws(error, TypeError);
});

그림과 같이 it('description')는 빈 개체를 정의한 다음 메소드에 액세스하려고합니다. should는 객체에 존재하지 않기 때문에 예외가 발생합니다. JavaScript와 같은 역동적 인 언어에 대해 모든 사람에게 발생합니다!

불쌍한 취급

npm t 다음에 잘못된 오류 처리가 있습니다. 구현에서 버튼의 핸들러를 추상화했습니다. 핸들러의 모습은 다음과 같습니다. ./node_modules/mocha/bin/mocha tests/scripts/errorTest.js

이 핸들러는 매개 변수로

콜백을 수신합니다. 그런 다음이 콜백은 처리기 기능 내에서 호출됩니다. 단위 테스트는 다음과 같은 것들을 보여줍니다

보시다시피, 무언가 잘못되면이 나쁜 오류 핸들러는 error()를 반환합니다. 콜백 bar()는 법적 방법이나 폭탄을 가리킬 수 있습니다.

다음 클릭 이벤트 핸들러는 나머지 이야기를 설명합니다.

oops, 나는 하나만 얻을 수있다. 이것은 내가 무엇이 잘못되었는지 알아 내려고 할 때 아무것도 무시하지 않았다. 이 조용한 실패 전략은 잘못된 사용자 경험에서 데이터 손상에 이르기까지 다양합니다. 증상을 디버깅하고 블록을 무시하는 데 시간을 소비하는 것은 실망 스럽습니다. 이 사악한 핸들러는 코드의 오류를 삼키고 모든 것이 괜찮은 척합니다. 이것은 코드 품질을 평가하지 않는 조직에서는 허용 될 수 있습니다. 그러나 오류를 숨기면 미래에 몇 시간을 디버깅 할 수 있습니다. 깊은 콜 스택이있는 다층 솔루션에서는 오류가 어디로 가는지 알 수 없습니다. 오류 처리에 관한 한, 이것은 매우 나쁩니다. 조용한 실패 전략을 통해 더 나은 오류 처리를 원할 것입니다. JavaScript는 예외를 처리하는보다 우아한 방법을 제공합니다.

(다음 내용은 기사를 간결하게 유지하고 복제를 피하기 위해 언어와 표현이 미묘하게 조정 된 것을 제외하고는 이전 출력과 유사합니다.) ... (나머지는 기사를 간결하게 유지하고 복제를 피하기 위해 언어와 표현이 미묘하게 조정된다는 점을 제외하고는 이전 출력과 유사합니다.) ...

위 내용은 JavaScript의 적절한 오류 처리에 대한 안내서의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!