2. Javascript ES2015 (6) - 프로미스 [5/5]

 

 

 

 

 

앞선 아티클까지 우리는 프로미스 여러 개를 순차적으로 실행하는 방법까지 살펴보았습니다. 그런데, 순차적인 실행뿐만 아니라 여러 개를 한 번에 실행할 수 있는 방법도 존재합니다. 지금부터 그 방법을 하나씩 살펴보겠습니다. 

 

 

 

 

○ Promise.all과 Promise.resolve / Promise.reject

 

 

아래 코드를 보겠습니다. Promise.all을 이용해서 여러개의 프로미스를 한 번에 실행하는 예제입니다. 

 

const promise1 = Promise.resolve('SUCCESS 1');
const promise2 = Promise.resolve('SUCCESS 2');
Promise.all( [promise1, promise2] )
    .then( (result) => {
        console.log(result);    // SUCCESS 1, SUCCESS 2
    })
    .catch( (error) => {
        console.error(error);
    })

 

 

우선, Promise.resolve는 실행 즉시 resolve하는 프로미스를 만드는 역할을 합니다(reject도 마찬가지입니다). 예제와 같이, 프로미스가 여러 개 있다면 Promise.all에 넣을 수 있죠. 그러면 모두가 resolve 될 때까지 기다렸다가 then으로 넘어가게 됩니다. 

 

여기서 then의 파라미터인 result에는 모든 프로미스의 결괏값이 배열로 전달됩니다. 즉, SUCCESS 1과 SUCCESS 2가 배열로 전달되는 것이죠. 만일, 여기 전달된 프로미스 중 한 개라도 reject이 된다면 이는 catch로 넘어가게 됩니다. 다만 여기서 주의할 점은, reject로 인해 catch로 넘어간다 하더라도, 여기서 어떤 프로미스가 reject 되었는지는 알 수 없는 상태입니다.

 

 

 

---

 

 

 

○ Promise.allSettled

 

위의 예시에서처럼, 여러 개의 프로미스 중 정확히 어떤 프로미스가 reject가 되었는지 알기 위해서는 Promise.allSettled를 사용해야 합니다. 

 

const promise1 = Promise.resolve('SUCCESS 1');
const promise2 = Promise.reject('FAILED 2');
const promise3 = Promise.resolve('SUCCESS 3');
Promise.allSettled( [promise1, promise2, promise3] )
    .then( (result) => {
        console.log(result);    
    })
    .catch( (error) => {
        console.error(error);
    })

/*
[
    { status: 'fulfilled, value: 'SUCCESS 1' },
    { status: 'rejected', reason: 'FAILED 2' },
    { status: 'fulfilled', value: 'SUCCESS 3' }
]
*/

 

 

reject 된 부분은 reason에서 확인할 수 있습니다. 실제로 단순히 Promise.all 보다는 Promise.allSettled 사용이 권장됩니다. Node 16 부터는 reject 된 Promise에는 반드시 catch를 달아야 합니다. (UnhandledPromiseRejection 예외 발생)

 

try{
    Promise.reject('에러메시지');
} catch (e){
    console.error(e);
}


Promise.reject('에러메시지').catch(() => {
    // catch 메서드를 붙이면 에러 발생하지 않음
})