비동기 forEach 작업이 완료된 후 콜백을 실행하는 방법은 무엇입니까?

비동기 forEach 작업이 완료된 후 콜백 실행

문제

콜백 함수를 모두 비동기로 실행하려면 어떻게 해야 합니까? forEach 루프 내의 작업이 완료되었습니까?

답변

Array.forEach는 이 시나리오에 대해 기본 솔루션을 제공하지 않지만 다음이 있습니다. 원하는 기능을 달성하기 위한 다양한 접근 방식.

카운터 사용

<br>function callback() { console.log('all done'); }</p>
<p>var itemsProcessed = 0;</p>
<p>[1, 2, 3].forEach(item => {<br> asyncFunction(item, () => {</p>
<pre class="brush:php;toolbar:false">itemsProcessed++;
if(itemsProcessed === array.length) {
  callback();
}

});
});

이 접근 방식은 비동기 작업이 완료될 때마다 증가하는 카운터를 사용합니다. 카운터가 배열의 총 항목 수에 도달하면 콜백 함수가 호출됩니다.

ES6 Promises 사용

• 동기 실행:
  < ;pre>
  const 요청 = [1, 2, 3].reduce((promiseChain, item) => {
  return promiseChain.then(() => new Promise((resolve) => {
  asyncFunction(item, 해결);
  }));
  }, Promise.resolve());

requests.then(() => console. log('done'))

이 예에서는 다음 작업이 시작되기 전에 각 비동기 작업이 완료되도록 약속을 연결합니다.

• 비동기 실행:
  <사전>
  const 요청 = [1,2,3].map((item) => {
  return new Promise((resolve) = > {
  asyncFunction(항목, 해결);
  });
  })

Promise.all(requests).then(() => console.log ('done'));

이 경우 Promise.all 메서드를 사용하여 모든 비동기 작업을 동시에 실행한 다음 모든 작업이 완료되면 콜백을 호출합니다.

비동기 라이브러리 사용

async와 같은 비동기 라이브러리는 원하는 기능을 보다 우아하게 표현할 수 있는 메커니즘을 제공합니다.

위 내용은 비동기 forEach 작업이 완료된 후 콜백을 실행하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!