TypeScript를 사용하다 보면 네트워크 요청이나 파일 읽기와 같은 비동기 작업을 수행해야 하는 경우가 있습니다. 이러한 작업을 수행할 때는 성공 또는 실패에 대한 처리 방법을 알고 있어야 합니다. 이 블로그 포스트에서는 TypeScript에서의 비동기 작업에 대한 성공/실패 처리 방법에 대해 알아보겠습니다.

1. Promise를 사용한 비동기 작업

TypeScript에서 비동기 작업은 대부분 Promise를 사용하여 처리됩니다. Promise는 비동기 작업의 성공 또는 실패를 다루기 위한 객체입니다. 일반적으로 비동기 함수는 Promise 객체를 반환하고, 이를 통해 비동기 작업의 성공과 실패를 처리할 수 있습니다.

아래는 Promise를 사용하여 비동기 작업을 수행하고 성공과 실패를 처리하는 예제 코드입니다.

function fetchData(): Promise<string> {
  return new Promise((resolve, reject) => {
    // 비동기 작업 수행
    if (/* 성공 조건 */) {
      resolve('데이터 가져오기 성공');
    } else {
      reject(new Error('데이터 가져오기 실패'));
    }
  });
}

// 비동기 작업 수행 후 성공과 실패 처리
fetchData()
  .then((data) => {
    console.log(data); // 성공 시 처리 로직
  })
  .catch((error) => {
    console.error(error); // 실패 시 처리 로직
  });

2. async/await를 사용한 비동기 작업

async/await는 ES2017부터 지원되는 기능으로, Promise를 좀 더 간결하고 직관적으로 사용할 수 있게 해줍니다. async 함수 내에서 await 키워드를 사용하여 비동기 작업의 완료를 기다릴 수 있고, 작업의 성공과 실패를 간편하게 처리할 수 있습니다.

아래는 async/await를 사용하여 비동기 작업을 수행하고 성공과 실패를 처리하는 예제 코드입니다.

async function fetchData(): Promise<void> {
  try {
    const data = await fetchDataFromApi(); // 비동기 작업 수행
    console.log(data); // 성공 시 처리 로직
  } catch (error) {
    console.error(error); // 실패 시 처리 로직
  }
}

async/await를 활용하면 비동기 작업의 성공과 실패를 처리하는 코드가 보다 간결해지고 가독성이 좋아집니다.

TypeScript에서의 비동기 작업에 대한 성공/실패 처리를 위해 Promise와 async/await를 적절히 활용하면 가독성이 좋은 코드를 작성할 수 있습니다.

이렇게 TypeScript에서의 비동기 작업에 대한 성공/실패 처리 방법을 알아보았습니다. 다양한 상황에 맞게 Promise나 async/await를 적절히 활용하여 비동기 작업을 처리할 수 있습니다.

참고 문헌: MDN Web Docs - Promise, MDN Web Docs - async function