> 웹 프론트엔드 > JS 튜토리얼 > `Promise.all()`은 확인된 값의 순서를 보장합니까?

`Promise.all()`은 확인된 값의 순서를 보장합니까?

Mary-Kate Olsen
풀어 주다: 2024-11-03 05:40:02
원래의
938명이 탐색했습니다.

Does `Promise.all()` Guarantee the Order of Resolved Values?

Promise.all: 해결된 값의 순서

Promise.all() 메서드는 여러 Promise의 동시 실행 및 해결을 가능하게 하여 개발자에게 비동기 프로그래밍을 위한 강력한 도구를 제공합니다. . Promise.all()의 결과 배열 내에서 해결된 값의 순서와 관련하여 흥미로운 질문이 제기됩니다.

MDN(Mozilla Developer Network)에 따르면 Promise의 .then() 콜백에서 얻은 결과가 나왔습니다. all()은 입력 약속과 동일한 순서로 정렬된 것으로 보입니다. 예를 들면 다음과 같습니다.

var somePromises = [1, 2, 3, 4, 5].map(Promise.resolve);
return Promise.all(somePromises).then(function(results) {
  console.log(results) //  is [1, 2, 3, 4, 5] the guaranteed result?
});
로그인 후 복사

이 동작은 Promises 사양에 의해 보장됩니까? 알아보기 위해 기술적인 세부 사항을 살펴보겠습니다.

Promise.all()에서 순서 유지

Promise.all(iterable) 메서드에서 iterable은 Promise 모음을 나타냅니다. PerformPromiseAll(iterator, constructor, resultCapability) 함수는 내부적으로 호출되며 IteratorStep(iterator)을 사용하여 반복 가능 항목을 반복합니다.

Promise가 확인된 값으로 해결되면 Promise.all() Resolve가 호출됩니다. 해결된 각 Promise에는 내부 [[Index]] 슬롯이 있어 원래 Iterable 내 위치를 나타냅니다.

결과적으로 Promise.all()의 출력은 Promise.all()의 Promise 순서에 해당하는 엄격한 순서를 유지합니다. 입력은 반복 가능합니다. 이는 제공된 반복 가능 항목(예: 배열)이 엄격하게 정렬되어 있는 한 마찬가지입니다.

순서 보존 데모

다음은 Promise.all()의 순서 보존을 보여주는 실제 예입니다.

<code class="javascript">// Used to display results
const write = msg => {
  document.body.appendChild(document.createElement('div')).innerHTML = msg;
};

// Different speed async operations
const slow = new Promise(resolve => {
  setTimeout(resolve, 200, 'slow');
});
const instant = 'instant';
const quick = new Promise(resolve => {
  setTimeout(resolve, 50, 'quick');
});

// The order is preserved regardless of what resolved first
Promise.all([slow, instant, quick]).then(responses => {
  responses.map(response => write(response));
});</code>
로그인 후 복사

이 시나리오에서는 'instant' 값이 즉시 확인되고 그 다음에는 'quick'과 'slow'가 확인됩니다. 그러나 Promise.all()의 순서 보존에 따라 결과는 'slow', 'instant', 'quick' 순서로 표시되며 입력 배열 내의 promise 순서에 맞춰 정렬됩니다.

위 내용은 `Promise.all()`은 확인된 값의 순서를 보장합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿