Promise.all에서 오류 잡기

Javascript의 Promise.all에 대한 안전한 대안

오류를 포함한 모든 약속 대기

자바스크립트 개발자라면 배열에 제공된 모든 Promise가 해결될 때까지 기다리는 표준 내장 객체 Promise와 API Promise.all을 사용했을 가능성이 큽니다. 이것은 비즈니스 로직을 진행하기 전에 다양한 비동기 결과를 기다리는 매우 우아한 방법입니다.

그러나 이 API는 오류를 처리하지 않습니다. Promise 배열에서 적어도 하나의 오류가 발생할 때마다 함수는 즉시 중지되고 더 이상의 결과는 기다리지 않습니다.

Promise.allSettled는 모든 비동기 결과를 기다립니다.

운 좋게도 결과가 유효하거나 오류가 있더라도 모든 약속을 기다리도록 보장하는 Promise.allSettled라는 두 번째 API가 있습니다. 다음 코드는 사용법을 보여줍니다. 이것은 정말 간단하지만 많은 골칫거리를 덜어줄 수 있습니다.

Promise.all과의 주요 차이점은 각 Promise가 정보의 튜플로 해결된다는 것입니다. 여기서 상태(이행 또는 거부됨)와 값(이행된 경우) 또는 이유(거부된 경우)를 모두 사용할 수 있습니다. .

빈 배열 제공

주의해야 할 특별한 경우는 Promise.allSettled가 입력으로 빈 배열을 수신하면 즉시 빈 배열로 해석된다는 것입니다. 이것은 논리적으로 들리고 예상되는 동작이지만 여전히 지적하고 싶었습니다.

/**
 * A simple dummy function that
 * fetches data from multiple
 * endpoints related to a user.
 */
async function fetchUserData(id){
  // A simple array of promises.
  // The first two parameters are
  // mock calls from down below.
  const promises = [
    fetchUserHistory(id),
    fetchUserProfile(id),
    // For testing only, let's throw.
    Promise.reject(new Error('an error'))
];
  
  const values = await Promise.allSettled(promises);
  // values === [
  //    { status: "fulfilled", value: [1, 2, 3] },
  //    { status: "fulfilled", value: {name:"dummy"} },
  //    { status: "rejected", reason: {}
  // ]
}

// The following functions are just mocks
// and should help improve readability
// of the example at the top.

async function fetchUserHistory(id){
  return Promise.resolve([1,2,3]);
}

async function fetchUserProfile(id){
  return Promise.resolve({ name: "dummy" });
}

보시다시피, Promise.allSettled는 Promise.all에 아주 좋은 추가 기능이며 결과와 상관없이 모든 결과를 기다릴 수 있습니다. 이 API가 모든 사용 사례에 적합하다고 생각하지는 않지만 오버헤드 try-catch-block에서 비동기 호출을 래핑하지 않아도 됩니다.