JavaScript에서 비동기 코드를 작성하다 보면 Promise와 async/await를 자주 사용하게 됩니다. 이 둘은 비동기 코드를 처리하는데 사용되는 도구로, 각각의 장단점이 있습니다. 이번 포스트에서는 async/await와 Promise의 관계에 대해 알아보겠습니다.

Promise

Promise는 비동기 작업의 결과를 나타내는 객체입니다. 비동기 작업이 성공하면 resolve가 호출되고, 실패하면 reject가 호출됩니다. 이후 .then()과 .catch()를 이용해 성공 또는 실패 시의 동작을 정의할 수 있습니다.

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (Math.random() < 0.5) {
      resolve('Success!');
    } else {
      reject(new Error('Failure!'));
    }
  }, 1000);
});

promise
  .then(result => {
    console.log(result);
  })
  .catch(error => {
    console.error(error);
  });

async/await

async/await는 Promise를 사용하여 비동기 코드를 작성할 때의 편의성을 높여줍니다. async 함수는 항상 Promise를 반환하며, await는 Promise가 처리될 때까지 기다리고 그 결과를 반환합니다.

async function asyncFunction() {
  try {
      const result = await someAsyncOperation();
      console.log(result);
  } catch (error) {
      console.error(error);
  }
}

asyncFunction();

async/await와 Promise의 관계

async/await는 사실 Promise의 syntactic sugar(문법적 설탕)로, 코드의 가독성과 유지보수성을 높여줍니다. async/await는 Promise를 기반으로 동작하며, 순차적인 비동기 코드를 작성할 때 Promise에 비해 간편하고 직관적입니다.

그러나 async/await를 사용하더라도 내부적으로는 결국 Promise를 사용하고 있기 때문에 두 가지 모두 잘 이해하고 활용할 수 있어야 합니다.

async/await와 Promise는 둘 다 비동기 코드를 처리하는 데 있어 유용한 기능을 제공하며, 상황에 맞게 적절히 활용하여 프로그래밍할 수 있다면 좋은 코드를 작성할 수 있을 것입니다.

이상으로 async/await와 Promise의 관계에 대해 알아보았습니다.

자세한 내용은 MDN web docs를 참고하시기 바랍니다.