[JavaScript] 프로미스(Promise)

자바스크립트에서 프로미스(Promise)란, 비동기식으로 처리되는 코드의 결과를 담게 되는 객체입니다. 실행되는 코드의 결과 값에 따라서 어떠한 동작을 실행할지 정할 수 있기 때문에 코드 로직을 더 섬세하게 작성하는 것이 가능해집니다. 보통 네트워크 통신이나 파일을 읽을 때 사용되는데, 데이터를 읽지 못한 상황에서도 데이터를 표시하려고 하면 발생하는 오류를 프로미스를 통해 예방할 수 있기 때문입니다. 

 

프로미스는 세 가지 상태를 가질 수 있습니다. 

1) 대기(Pending) : 프로미스가 선언되면 가지게 되는 초기 값으로, 비동기 처리 연산이 완료되기까지 대기하고 있는 상태입니다.

2) 이행(Fulfilled) : 비동기 처리 연산이 성공적으로 완료된 상태입니다.

3) 거절(Rejected) : 비동기 처리 연산이 실패하거나 오류가 발생한 상태입니다.

 

프로미스가 완료 상태가 되면 resolve 인자로 전달받은 함수가 실행되며, 거절 상태가 되면 reject 인자로 전달받은 함수가 실행됩니다. 다음 예시의 코드에서는 if 조건문에 따라서 프로미스의 상태가 결정됩니다. 

const promise_ex = new Promise((resolve, reject) => {
  if( ... ) {
    resolve("Fulfilled!");
  } else {
    reject("Rejected!");
  }
});

 

대기 상태에서 벗어나서 프로미스의 상태가 결정되면, then과 catch 메소드를 통해서 결과 값을 다룰 수 있습니다. then 메소드는 프로미스가 완료되었을 때, catch 메소드는 프로미스가 거절되었을 때 실행됩니다. 

promise_ex.then((value) => {
  console.log("Promise State:", value);
}).catch((error) => {
  console.error("Promise State:", error);
});

value 값은 resolve 메소드에 전달된 인자이며, error 값은 reject 메소드에 전달된 인자입니다. 

 

then 메소드를 여러 개 사용함으로써 프로미스를 연결(Promise Chaining)할 수 있습니다. 다수의 프로미스들이 모두 완료되지 못하면 마지막에 붙어 있는 catch 메소드로 오류를 처리하는 것입니다. 

promise_ex2
  .then(result1)
  .then(result2)
  .then(result3)
  .catch(failure);

 

 

프로미스를 연결하는 것의 장점은 코드의 가독성을 높이는 것 뿐만이 아니라, 여러 개의 프로미스에서 발생하는 오류를 모두 하나의 콜백 함수로 처리할 수 있다는 것입니다.