[JavaScript] 프로미스(Promise)

* 프로미스(Promise)란?

자바스크립트에서 프로미스(Promise)는 비동기 작업의 결과를 나타내는 객체입니다. 비동기 작업은 일반적으로 서버에서 데이터를 가져오거나 파일을 읽는 등 시간이 걸리는 작업을 말합니다. 프로미스는 이러한 비동기 작업의 성공 또는 실패와 그 결과 값을 처리하기 위해 사용됩니다.

 

프로미스는 세 가지 상태를 갖습니다:

1. 대기(pending): 비동기 작업이 아직 완료되지 않은 상태입니다.
2. 이행(fulfilled): 비동기 작업이 성공적으로 완료되어 결과 값을 반환한 상태입니다.
3. 거부(rejected): 비동기 작업이 실패한 상태입니다.

기본 예시

const myPromise = new Promise((resolve, reject) => {
  // 비동기 작업 수행
  // 작업이 성공하면 resolve 함수 호출하여 결과 값 반환
  // 작업이 실패하면 reject 함수 호출하여 실패 사유 반환
});

myPromise.then((result) => {
  // 작업이 성공한 경우 실행되는 콜백 함수
  // result는 작업의 결과 값입니다.
}).catch((error) => {
  // 작업이 실패한 경우 실행되는 콜백 함수
  // error는 실패 사유를 나타내는 에러 객체입니다.
});

 

위의 코드에서 new Promise((resolve, reject) => { ... })는 프로미스 객체를 생성하는 구문입니다. 이 안에 비동기 작업을 수행하고, 작업이 성공하면 resolve 함수를 호출하여 결과 값을 반환하고, 작업이 실패하면 reject 함수를 호출하여 실패 사유를 반환합니다.

 

myPromise.then((result) => { ... })은 프로미스가 성공 상태가 될 때 실행되는 콜백 함수를 등록하는 구문입니다. result는 작업의 결과 값입니다. myPromise.catch((error) => { ... })는 프로미스가 실패 상태가 될 때 실행되는 콜백 함수를 등록하는 구문이며, error는 실패 사유를 나타내는 에러 객체입니다.

또한, 프로미스는 여러 개의 비동기 작업을 순차적 또는 병렬로 처리할 수 있으며, Promise.all, Promise.race, async/await 등의 기능을 제공합니다.

 

프로미스는 비동기 작업을 처리하고 결과를 다루는 도구이고, 콜백 헬(callback hell)을 피하고 코드의 가독성을 향상시키는 데 도움이 됩니다.

 

그렇다면 프로미스를 사용하면 비동기 코드를 동기적으로 처리할 수 있는가?

=> No!

프로미스를 사용하여 비동기 코드를 동기적으로 처리하는 것은 기본적으로는 불가능합니다. 프로미스는 비동기 작업의 결과를 처리하기 위한 메커니즘으로 설계되었으며, 자체적으로 동기적인 특성을 갖지 않습니다.

프로미스는 비동기 작업의 완료 여부를 기다리지 않고 다음 코드로 진행됩니다. 프로미스 객체를 반환하는 함수를 호출할 때, 해당 함수는 즉시 프로미스를 반환하고 비동기 작업이 백그라운드에서 실행됩니다. 그리고 프로미스가 완료되면 .then() 메서드를 통해 결과를 처리하거나 .catch() 메서드를 통해 실패를 처리합니다.

 

하지만, ES2017에서 도입된 async/await 문법을 사용하면 프로미스를 동기적으로 처리하는 것처럼 보이는 코드를 작성할 수 있습니다. async 함수 내에서 await 키워드를 사용하여 프로미스가 완료될 때까지 기다릴 수 있습니다. 그러나 실제로는 await 키워드가 프로미스를 비동기적으로 처리하고, async 함수가 프로미스를 반환하는 비동기 함수라는 점을 기억해야 합니다.

 

예를 들어, 다음은 async/await를 사용하여 비동기 작업을 동기적으로 처리하는 예입니다:

async function fetchData() {
  try {
    const result = await myPromise; // 비동기 작업이 완료될 때까지 기다림
    console.log(result); // 작업의 결과 값 출력
  } catch (error) {
    console.error(error); // 작업 실패 시 에러 처리
  }
}

fetchData();

 

위의 코드에서 await myPromise은 myPromise가 완료될 때까지 기다린 후 결과 값을 반환합니다. 이렇게 await를 사용하면 비동기적인 코드를 동기적으로 처리하는 것처럼 보일 수 있지만, 실제로는 내부적으로는 비동기적으로 처리되고 프로미스를 반환하는 것입니다.

 

따라서 프로미스를 사용하여 비동기 코드를 완전히 동기적으로 처리할 수는 없지만, async/await를 사용하면 코드를 보다 동기적으로 작성할 수 있습니다.