본문 바로가기

JavaScript

비동기 호출, Promise를 이해해 보자(2).

반응형

 

2020/04/12 - [JavaScript] - 비동기 호출, Promise를 이해해 보자.

 

Promise의 기본 사용법을 다룬 지난 글에 이어서, 이번에는 여러 동기화 작업을 동시에 다루는 방법을 알아보겠습니다.

 

Promise.all()

 

Promise.all()

The Promise.all() method returns a single Promise that fulfills when all of the promises passed as an iterable have been fulfilled or when the iterable contains no promises or when the iterable contains promises that have been fulfilled and non-promises th

developer.mozilla.org

Promise가 제공하는 all이라는 함수를 사용하면, primise로 실행되는 여러 동기화 작업이 모두 끝난 후 그 결과를 한꺼번에 받을 수 있습니다.

 

사용법은 매우 간단합니다.

 

let promise1 = new Promise( resolve => setTimeout(() => resolve("promise1"), 3000));
let promise2 = new Promise( resolve => setTimeout(() => resolve("promise2"), 1000));
let promise3 = new Promise( resolve => setTimeout(() => resolve("promise3"), 2000));

Promise.all([promise1, promise2, promise3]).then(values => console.log(values));

 

 

 

 

위 코드를 크롬의 개발자 툴에 있는 콘솔에서 실행하면 아래와 같이 모든 비동기 작업이 종료된 후 결괏값을 한꺼번에 출력합니다.

 

Promise.all() 예제

비동기 작업이 끝나는 시점을 통일시키고 싶을 때가 있을지는 모르겠지만, 이런 기능도 있다는 것을 알아두면 좋을 것 같습니다.

반응형