ES2020에 Promise.allSettled이라는 녀석이 추가 되었다.
이게 추가가 되었다는 말은 어딘가에 쓰니까 추가 되었을텐데, 일단 오늘은 이녀석에 대해 알아보자.
Promise.allSettled란?
Promise.allSettled 메서드는 주어진 모든 프로미스를 이행하거나 거부한 후, 각 프로미스에 대한
결과를 나타내는 객체 배열을 반환합니다.
즉, 10개의 Promise객체를 가진 배열을 수행하여, fulfilled와 rejected를 배열에 담아 반환한다는 의미이다.
Promise.allSettled는 어떤 때 사용할까?
그럼 이제 Promise.allSettled에 대해서 알았다. 결국 Promise객체를 담은 배열을 수행하여
성공한 객체와 실패한 객체 전부들 배열에 담아 리턴해준다는 의미인데
그럼 이걸 어떤때에 사용해야 할까?
보통 우리가 Promise.all과 같은 병렬처리를 수행하는 메서드를 사용한다는 건, 많은 양의 통신을 한다는건데,
Promise.all은 하나라도 통신이 실패하면 빈 배열을 리턴, 즉 성공한 통신들도 실패로 처리하고 리턴하기 때문에
네트워크 통신에러나 서버에서 거부를 한다던지의 문제가 발생하면 우리가 기대하는 값을 얻기 어렵다.
이때, Promise.allSettled를 사용하면 된다.
어떤 이유에서든지 통신이 실패했다고 하더라도, 성공한 통신 데이터만이라도 리턴 받을 수 있기 때문이다.
결론은 내가 Promise를 통해 서버통신을 하는데, 서버통신이 실패를 하더라도
서버통신이 성공한 객체와 실패한 객체 전부를 리턴 받고자 할 때 사용하면 된다는 것이다.
Promise.allSettled 사용방법 및 샘플코드
기본코드
Promise.allSettled(프로미스 배열)
Promise.allSettled([promise1, promise2, promise3])
기본코드는 위와 같다. Promise.all과 같다. 단지 메서드명만 바뀌었을 뿐..
아래의 Promise.all 메서드와 Promise.allSettled메서드를 비교하는 코드를 보면 더 이해가 쉬울 것이다.
Promise.all 샘플코드
// 성공 Promise 객체 생성
const myPromise1 = new Promise((resolve, reject) => {
return resolve(`Success! number`);
});
// 성공 Promise 객체 생성
const myPromise2 = new Promise((resolve, reject) => {
return resolve(`Success! number`);
});
// 실패 Promise 객체 생성
const myPromise3 = new Promise((resolve, reject) => {
return reject(`Failed! number`);
});
const myPromises = [myPromise1, myPromise2, myPromise3];
const callPromise = async () => {
return Promise.all(myPromises);
};
const result = callPromise();
console.log(result);
결과
Promise.allSettled 샘플코드
// 성공 Promise 객체 생성
const myPromise1 = new Promise((resolve, reject) => {
return resolve(`Success! number`);
});
// 성공 Promise 객체 생성
const myPromise2 = new Promise((resolve, reject) => {
return resolve(`Success! number`);
});
// 실패 Promise 객체 생성
const myPromise3 = new Promise((resolve, reject) => {
return reject(`Failed! number`);
});
const myPromises = [myPromise1, myPromise2, myPromise3];
const callPromise = async () => {
return Promise.allSettled(myPromises);
};
const result = callPromise();
console.log(result);
결과
위의 결과들을 비교하면 단번에 이해가 된다.
Promise.all은 하나라도 rejected가 있으면 PromiseState를 rejected로 리턴하며,
처음 rejected된 이유를 들어 나머지도 전부 rejected가 된다.
Promise.allSettled는 rejected가 있더라도 PromiseState는 fulfilled를 리턴하며,
각 통신결과를 리턴해준다.
결론
Promise.all을 사용하며 기도메타에 들어가지 말고, Promise.allSettled을 사용하자.
단 환경에 따라 Promise.allSettled을 사용하도록 하자.
ES2020에 추가된 메서드이기 때문에 구형 브라우저에서는 아직 지원하지 않을 수 있다.
