Promise.all 과 Promise.race

Promise 는 자바스크립트에서 비동기 처리에 사용되는 객체입니다. 

비동기 처리란 특정 코드의 실행이 완료될때까지 다음 코드를 먼저 수행하는 자바스크립트의 특성을 의미합니다. 

 

이 Promise 에서 제공해주는 2개지 메서드중 all 과 race를 확인해 보겠습니다. 

먼저 Promise.all 에 대한 예시 코드를 확인해 보겠습니다. 

const promise1 = new Promise((resolve, reject) => resolve('즉시 호출'));
const promise2 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(' 3초뒤에 호출 ');
    }, 3000);
});

Promise.all([promise1, promise2]).then((value) => console.log(value)); 
// ['즉시 호출','3초되에 호출']

 

promise1,promise2 라는 Promise 의 객체를 만들어 각각 변수에 담은뒤에 Promise.all([]) 에 배열형태로 순서대로 담고 then 이라는 함수를 통해 Promise.all 에서 실행한 데이터를 value 로 담아 출력할수 있게 코드를 작성하였습니다. 

즉 Promise.all 은 배열안에 있는 Promise 객체가 모든 리턴 값을 기다리다후 한번에 출력을 합니다. 

 

그렇다면 race 함수는 어떻까요?

용어 그대로 race 는 먼저 도착한 Promise 객체를 출력해줍니다. 예제코드에서 all 함수를 race로 변경하여 출력을 해보았습니다. 

const promise1 = new Promise((resolve, reject) => resolve('즉시 호출'));
const promise2 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(' 3초뒤에 호출 ');
    }, 3000);
});

Promise.race([promise1, promise2]).then((value) => console.log(value))
// '즉시 호출'

 

Promise.all,Promise.race 는 Promise의 객체를 조작할때 필요한 함수입니다. 이후 race condition 의 이슈를 피하기 위해서라도 해당 함수는 잘 알아 두어야 합니다.