> 웹 프론트엔드 > JS 튜토리얼 > Promise.all()은 후속 작업을 진행하기 전에 어떻게 여러 비동기 작업을 효율적으로 처리할 수 있습니까?

Promise.all()은 후속 작업을 진행하기 전에 어떻게 여러 비동기 작업을 효율적으로 처리할 수 있습니까?

Patricia Arquette
풀어 주다: 2024-12-15 19:19:15
원래의
840명이 탐색했습니다.

How Can Promise.all() Efficiently Handle Multiple Asynchronous Tasks Before Proceeding to Subsequent Operations?

여러 Promise를 비동기식으로 작업

이 문서의 목적은 루프 내에서 여러 비동기 작업을 실행하는 데 따른 문제와 완료를 보장해야 하는 필요성을 해결하는 것입니다. 후속 작업을 진행하기 전에.

문제: 비동기 작업 처리 루프

루프가 일련의 작업을 반복하고 각 작업이 비동기식으로 실행되는 시나리오를 상상해 보세요. 루프 다음에 또 다른 루프는 첫 번째 루프의 작업 완료에 의존합니다. 이러한 조정을 어떻게 효율적으로 수행할 수 있습니까?

Promise 및 Promise.all()

Promise는 이 문제에 대한 우아한 해결책을 제공합니다. doSomeAsyncStuff()에서 Promise를 반환하면 비동기 작업을 관리할 수 있습니다.

Promise.all()은 Promise 배열을 허용하고 단일 Promise를 반환하는 강력한 메서드입니다. 이 단일 Promise는 모든 입력 Promise가 해결되거나 그 중 하나가 거부되는 경우에만 해결됩니다.

구현

목표를 달성하기 위해 Promise.all()을 다음과 같이 활용할 수 있습니다.

const promises = [];

for (let i = 0; i < 5; i++) {
  promises.push(doSomeAsyncStuff());
}

Promise.all(promises)
  .then(() => {
    // Execute tasks that require all async tasks to finish
  })
  .catch((e) => {
    // Handle errors
  });
로그인 후 복사

이 구현에서는 모든 Promise를 배열로 수집하여 Promise.all()에 전달합니다. 해결(또는 거부)되면 두 번째 루프의 작업을 진행합니다.

추가 고려 사항

  • 명확성을 더하려면 var 대신 const 또는 let을 사용하세요.
  • catch 메소드를 사용하여 오류 처리를 고려해보세요.
  • 자세한 이해를 위해서는 Promise에 대한 MDN의 문서와 내 책을 참조하세요. "JavaScript: The New Toys"(내 프로필에 제공되는 링크).

다음 예는 여러 비동기 작업이 완료될 때까지 기다리는 Promise.all()의 활용을 보여줍니다. 완료:

function doSomethingAsync(value) {
  return new Promise((resolve) => {
    setTimeout(() => {
      console.log("Resolving " + value);
      resolve(value);
    }, Math.floor(Math.random() * 1000));
  });
}

function test() {
  const promises = [];

  for (let i = 0; i < 5; i++) {
    promises.push(doSomethingAsync(i));
  }

  Promise.all(promises)
    .then((results) => {
      console.log("All done", results);
    })
    .catch((e) => {
      // Handle errors
    });
}

test();
로그인 후 복사

위 내용은 Promise.all()은 후속 작업을 진행하기 전에 어떻게 여러 비동기 작업을 효율적으로 처리할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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