두 개의 비동기 함수가 완료된 후 함수를 실행하는 방법 - JavaScript

두 요소가 모두 두 개의 비동기 함수인 두 요소의 배열이 있다고 가정합니다. 두 비동기 기능의 실행이 완료되면 콘솔에 무언가를 인쇄하는 것과 같은 작업을 수행해야 합니다(이 질문의 목적을 위해).

이 문제에 어떻게 접근할 수 있습니까?

비동기 작업 완료 시 작업을 수행하는 기본적으로 두 가지 방법이 있습니다 -

• 약속 사용
• 비동기/대기 기능 사용

그러나 코드에 많은(하나 이상의) 비동기 함수 처리가 포함되어 있으면 전자의 Promise.all 함수가 후자보다 우위에 있습니다.

예시

다음은 코드입니다 -

const arr = [
   new Promise((resolve, reject) => {
      setTimeout(() => {
         resolve('func1 fired!');
      }, 2000);
   }),
   new Promise((resolve, reject) => {
      setTimeout(() => {
         resolve('func2 fired');
      }, 3000);
   })
];
const lastFunction = () => {
   console.log('this function should be fired at the very last');
};
Promise.all([arr[0], arr[1]]).then((resp) => {
   console.log(resp);
   lastFunction();
}).catch((err) => {
   console.log('something unexpected happened');
})

출력

이것은 콘솔에서 다음과 같은 출력을 생성합니다 -

[ 'func1 fired!', 'func2 fired' ]
this function should be fired at the very last