반응형
2020/04/12 - [JavaScript] - 비동기 호출, Promise를 이해해 보자.
Promise의 기본 사용법을 다룬 지난 글에 이어서, 이번에는 여러 동기화 작업을 동시에 다루는 방법을 알아보겠습니다.
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));
위 코드를 크롬의 개발자 툴에 있는 콘솔에서 실행하면 아래와 같이 모든 비동기 작업이 종료된 후 결괏값을 한꺼번에 출력합니다.
비동기 작업이 끝나는 시점을 통일시키고 싶을 때가 있을지는 모르겠지만, 이런 기능도 있다는 것을 알아두면 좋을 것 같습니다.
반응형
'JavaScript' 카테고리의 다른 글
중첩된 div에서 마우스 클릭 이벤트 전달 방지. (0) | 2021.12.15 |
---|---|
css 속성 값으로 계산 식 넣기. (0) | 2021.12.09 |
div에 자동 스크롤 기능 적용하기 (0) | 2020.05.19 |
비동기 호출, async, await를 이해해 보자. (0) | 2020.04.16 |
비동기 호출, Promise를 이해해 보자. (0) | 2020.04.12 |