최신 자바스크립트 | 프로미스(promise)

 

 

프로미스(promise)는 비동기 상태를 값으로 다룰 수 있는 객체입니다. 프로미스를 사용하면 비동기 프로그래밍을 할 때 동기 프로그래밍 방식으로 코드를 작성할 수 있습니다. 프로미스 객체는 비동기 작업의 완료 또는 실패에 대한 결과값을 나타낼 수 있습니다. 프로미스는 최종 결과를 반환하지는 않고, 대신 상태값을 반환해서 미래의 어떤 시점에 결과를 제공합니다. 

 

프로미스는 다음 중 하나의 상태를 가집니다.

 

대기(pending) : 이행하거나 거부되지 않은 초기 상태.

이행(fulfilled) : 연산이 성공적으로 완료됨.

거부(rejected) : 연산이 실패함.

 

이행이나 거부가 처리되었을 때, 프로미스에 연결한 핸들러는 해당 프로미스의 then 메소드에 의해 처리됩니다. 

아래는 프로미스의 기본 예제 코드와 그 결과입니다.

let myFirstPromise = new Promise((resolve, reject) => {  
  setTimeout(function(){
    resolve("완료");
  }, 250);
});
 
myFirstPromise.then((successMessage) => {
  console.log("작업 " + successMessage);
});
console.log("Hi")
console.log("Hi")
console.log("Hi")

Hi
Hi
Hi
작업 완료

250ms의 간격을 두고 처리되는 동작을 새롭게 생성될 프로미스 객체의 작업으로 지정해두었습니다. 그런 다음 프로미스 객체를 실행시켰는데, 비동기적으로 코드가 처리되므로 맨 아래 세 줄의 console.log() 동작이 먼저 수행됨을 확인할 수 있습니다. 

 

프로미스에는 catch()라는 이름의 메소드 또한 존재합니다. catch()는 프로미스 수행 중 발생한 예외(문제 상황)를 처리하는 메서드입니다. catch() 메소드는 then() 메소드의 거절 이벤트를 처리하는 셈입니다. 

let myFirstPromise = new Promise((resolve, reject) => {  
  setTimeout(function(){
    throw new Error('에러 발생!'); //고의로 에러를 발생시키는 코드
  }, 250);
});
 
myFirstPromise.then((successMessage) => {
  console.log("작업 " + successMessage);
}).catch((error) => {
  console.error("에러 " + error);
})
console.log("Hi")
console.log("Hi")
console.log("Hi")

결과에서는 세 번의 Hi가 출력된 후 에러가 발생합니다.