Promise all

Promise.all() 메소드는, 입력으로서 약속의 반복 가능한 소요 번의 반환 Promise 그 입력 약속 결과의 배열을 해결한다. 이 반환 된 promise는 입력의 모든 promise가 해결되었거나 입력 iterable에 promise가없는 경우 해결된다. 입력 약속 거부 또는 비 약속 오류가 발생하면 즉시 거부하고이 첫 번째 거부 메시지 / 오류로 거부한다.

Promise.all(iterable)

• iterable
  반복 가능한 같은 객체 Array

반환 값

• 이미 해결 Promise 경우 반복 가능한이 통과가 비어 있습니다.
• 비동기 적으로 해결 Promise 은 if 반복 가능한 전달은 어떤 약속을 포함하지 않는다. 이 경우 Google Chrome 58은 이미 해결된 약속을 반환합니다 .
• 중인 Promise 다른 모든 경우이다. 이 반환된 약속은 주어진 iterable 의 모든 약속 이 해결되거나 약속이 거부되는 경우 비동기식으로 해결/거부됩니다 (스택이 비어 있는 즉시) . 아래 "Promise.all의 비동기성 또는 동기성"에 대한 예를 참조하십시오. 반환된 값은 완료 순서와 상관없이 전달된 Promise 순서입니다.

Description

이 방법은 여러 약속의 결과를 집계하는 데 유용 할 수 있습니다. 일반적으로 전체 코드가 성공적으로 작동하기 위해 의존하는 여러 관련 비동기 작업이있을 때 사용됩니다.이 작업은 모두 코드 실행이 계속되기 전에 수행해야합니다.

Promise.all() 즉시 거부 모든 거부 입력 약속. 이에 비해 Promise.allSettled() 의해 반환 된 promise는 거부 여부에 관계없이 모든 입력 promise가 완료되기를 기다립니다. 결과적으로 항상 입력 iterable에서 모든 promise와 함수의 최종 결과를 반환합니다.

이행(Fullfilment)

반환된 promise는 인수로 전달 된 iterable의 모든 확인된 값(비약속 값 포함)을 포함 하는 배열 로 이행됩니다 .

• 빈 iterable 이 전달되면 이 메서드에서 반환된 약속이 동기적으로 이행됩니다. 확인된 값은 빈 배열입니다.
• 비어 있지 않은 iterable 이 전달되고 모든 promise가 이행되거나 promise가 아닌 경우이 메서드에서 반환 된 promise는 비동기 적으로 이행됩니다.

Examples

Promise.all 사용

Promise.all 은 모든 이행 (또는 첫 번째 거부)을 기다립니다.

cosnt p1 = Promise.resolve(3);
const p2 = 1337;
const p3 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("foo");
  }, 100);
});

Promise.all([p1, p2, p3]).then(values => {
  console.log(values); // [3, 1337, "foo"]
});

iterable 에 non-promise 값이 포함되어 있으면 무시되지만 반환된 promise 배열 값에서 계속 계산됩니다(promise가 이행된 경우):

// 전달 된 이터 러블이 비어있는 것처럼 계산되므로 충족됩니다.
const p = Promise.all([1,2,3]);
// 전달 된 이터 러블에 값이 "444"인 해결 된 promise 만 포함 된 것처럼 계산되므로 충족됩니다.
const p2 = Promise.all([1,2,3, Promise.resolve(444)]);
// 전달 된 이터 러블에 값이 "555"인 거부 된 promise 만 포함 된 것처럼 계산되므로 거부됩니다.
const p3 = Promise.all([1,2,3, Promise.reject(555)]);

// setTimeout을 사용하여 스택이 비워진 후 코드를 실행할 수 있습니다.
setTimeout(function() {
    console.log(p);
    console.log(p2);
    console.log(p3);
});

// logs
// 약속 {<state> : "fulfilled", <value> : Array [3]}
// 약속 {<state> : "fulfilled", <value> : Array [4]}
// 약속 {<state> : "rejected", <reason> : 555}

Promise.all 의 비동기 성 또는 동기 성

다음 예제 는 Promise.all 의 비동기성(또는 전달 된 iterable 이 비어 있는 경우 동기성 )을 보여줍니다 .

// 이미 해결 된 promise의 배열을 인수로 전달합니다.
// 가능한 한 빨리 Promise.all을 트리거합니다.
const resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];

const p = Promise.all(resolvedPromisesArray);
// p의 값을 즉시 기록
console.log(p);

// setTimeout을 사용하여 스택이 비워진 후 코드를 실행할 수 있습니다.
setTimeout(function() {
    console.log('the stack is now empty');
    console.log(p);
});

// 로그, 순서대로 :
// 약속 {<상태> : "보류 중"}
// 스택이 이제 비어 있습니다.
// 약속 {<state> : "fulfilled", <value> : Array [2]}

Promise.all 이 거부하는 경우 에도 마찬가지입니다 .

const mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)];
const p = Promise.all(mixedPromisesArray);
console.log(p);
setTimeout(function() {
    console.log('the stack is now empty');
    console.log(p);
});

// logs
// 약속 {<상태> : "보류 중"}
// 스택이 이제 비어 있습니다.
// 약속 {<상태> : "거부 됨", <이유> : 44}

그러나 Promise.all 은 전달 된 iterable 이 비어 있는 경우에만 동기적으로 해결 됩니다 .

const p = Promise.all([]); // 즉시 해결됩니다.
const p2 = Promise.all([1337, "hi"]); // 비 약속 값은 무시되지만 평가는 비동기 적으로 수행됩니다.
console.log(p);
console.log(p2)
setTimeout(function() {
    console.log('the stack is now empty');
    console.log(p2);
});

// logs
// 약속 {<state> : "fulfilled", <value> : Array [0]}
// 약속 {<상태> : "보류 중"}
// 스택이 이제 비어 있습니다.
// 약속 {<state> : "fulfilled", <value> : Array [2]}

Promise.all 빠른 실패 동작

Promise.all 어떤 요소라도 거부되면 Promise.all 은 거부됩니다. 예를 들어, 시간 종료 후 해결되는 4 개의 약속과 즉시 거부하는 하나의 약속을 Promise.all 하면 Promise.all 이 즉시 거부합니다.

const p1 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('one'), 1000);
});
const p2 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('two'), 2000);
});
const p3 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('three'), 3000);
});
const p4 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('four'), 4000);
});
const p5 = new Promise((resolve, reject) => {
  reject(new Error('reject'));
});

// .catch 사용 :
Promise.all([p1, p2, p3, p4, p5])
.then(values => {
  console.log(values);
})
.catch(error => {
  console.error(error.message)
});

//From console:
//"reject"

가능한 거부를 처리하여이 동작을 변경할 수 있습니다.

const p1 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('p1_delayed_resolution'), 1000);
});

const p2 = new Promise((resolve, reject) => {
  reject(new Error('p2_immediate_rejection'));
});

Promise.all([
  p1.catch(error => { return error }),
  p2.catch(error => { return error }),
]).then(values => {
  console.log(values[0]) // "p1_delayed_resolution"
  console.error(values[1]) // "오류 : p2_immediate_rejection"
})