반응형
try catch
try...catch 문은 예외 처리(Exception Handling)를 위해 사용됩니다. 코드 실행 중 오류가 발생하면 try 블록에서 예외가 감지되고, catch 블록에서 해당 예외를 처리할 수 있습니다. 이를 통해 프로그램이 예상치 못한 오류로 인해 중단되는 것을 방지할 수 있습니다.
try...catch 문 기본 구조
try {
// 오류가 발생할 가능성이 있는 코드
} catch (error) {
// 오류가 발생했을 때 실행되는 코드
} finally {
// 선택적으로 사용 가능하며, 오류 발생 여부와 관계없이 실행됨
}
finally 블록은 예외 발생 여부와 상관없이 실행되는 부분으로, 주로 리소스 정리 등에 사용됩니다.
fetch와 async/await을 활용한 예제
아래는 fetch를 사용하여 데이터를 가져오는 비동기 함수에서 try...catch를 이용해 오류를 처리하는 예제입니다.
async function fetchData(url) {
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP 오류! 상태 코드: ${response.status}`);
}
const data = await response.json();
console.log("데이터 가져오기 성공:", data);
return data;
} catch (error) {
console.error("데이터 가져오기 실패:", error.message);
}
}
// 사용 예시
fetchData("https://jsonplaceholder.typicode.com/posts/1");
코드 설명
- fetchData 함수는 async 키워드를 사용하여 비동기 함수로 선언됩니다.
- try 블록 내부에서 fetch를 사용하여 url에서 데이터를 가져옵니다.
- 응답이 정상적인지 확인하기 위해 response.ok를 검사하며, 오류가 있으면 throw를 이용해 예외를 발생시킵니다.
- await response.json()을 사용하여 JSON 데이터를 변환하고 출력합니다.
- 오류가 발생하면 catch 블록에서 이를 감지하고 console.error를 통해 오류 메시지를 출력합니다.
이러한 방식으로 네트워크 요청에서 발생할 수 있는 예외를 처리하고, 사용자에게 적절한 피드백을 제공할 수 있습니다.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/try...catch
try...catch - JavaScript | MDN
try...catch 문은 try 블록과 catch 블록, finally 블록 중 하나 혹은 두 블록으로 구성됩니다. try 블록 내 코드가 먼저 실행되고, 만약 그 안에서 예외가 발생한다면 catch 블록 내 코드가 실행됩니다. final
developer.mozilla.org
반응형
'프론트엔드 > javascript' 카테고리의 다른 글
getter setter (1) | 2025.02.02 |
---|---|
requestpointerlock API (1) | 2025.01.31 |
Web Crypto API (1) | 2025.01.19 |
requestAnimationFrame vs setInterval (0) | 2025.01.12 |
Node.js vs Express.js (0) | 2025.01.05 |