Promise 와 async-await

promise 객체를 반환하는 함수를 async-await 구조로 바꾸려면 무엇을 해야해?

 

 

Promise 객체를 반환하는 함수를 async-await 구조로 바꾸려면 다음과 같은 단계를 따르면 됩니다.

1. 함수에 async 키워드 추가

함수 선언 앞에 async 키워드를 추가하여 비동기 함수임을 명시합니다. 이렇게 하면 함수 내에서 await 키워드를 사용할 수 있게 됩니다.

예시:

JavaScript

async function fetchData() {
  // ... (Promise를 반환하는 로직)
}

Use code with caution.

 

2. Promise 반환 부분을 await로 감싸기

Promise를 반환하는 부분 앞에 await 키워드를 추가합니다. 이렇게 하면 Promise가 해결(resolve)되거나 거부(reject)될 때까지 함수 실행이 일시 중지됩니다. Promise가 해결되면 결과 값을 반환하고, 거부되면 예외를 throw합니다.

예시:

JavaScript

async function fetchData() {
  try {
    const data = await somePromiseFunction(); // Promise 반환 함수 호출
    return data; 
  } catch (error) {
    console.error('Error fetching data:', error);
    throw error; // 또는 다른 에러 처리 로직 수행
  }
}

Use code with caution.

 

3. try...catch 블록으로 에러 처리

await 키워드를 사용하는 부분을 try...catch 블록으로 감싸서 Promise가 거부될 때 발생하는 예외를 처리합니다.

4. 함수 호출 부분 변경

async 함수를 호출하는 부분에서는 반환 값이 Promise이므로, .then(), .catch(), .finally()를 사용하거나, 호출하는 함수도 async로 만들고 await 키워드를 사용하여 결과 값을 받을 수 있습니다.

예시:

JavaScript

// .then(), .catch() 사용
fetchData()
  .then(data => {
    console.log(data);
  })
  .catch(error => {
    console.error(error);
  });

// async 함수에서 await 사용
async function processData() {
  try {
    const data = await fetchData();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

Use code with caution.

 

참고:

• async 함수는 항상 Promise를 반환합니다. await 키워드를 사용하지 않더라도 암묵적으로 Promise를 반환합니다.
• await 키워드는 반드시 async 함수 내에서만 사용할 수 있습니다.

요약:

Promise 객체를 반환하는 함수를 async-await 구조로 바꾸면 비동기 코드를 동기 코드처럼 작성하여 가독성을 높이고 에러 처리를 간편하게 할 수 있습니다. 핵심은 함수에 async 키워드를 추가하고, Promise 반환 부분을 await로 감싸는 것입니다.