Promise - Promise.all, Promise.race

ex) value가 프로미스 객체인지 아닌지 알 수 없는 경우, 사용하면 연결된 then 메서드를 실행한다.

value가 프로미스 객체면, resolve된 then 메서드를 실행한다.

value가 프로미스 객체가 아니면, value 를 인자로 보내면서 then 메서드를 실행한다.

Promise.resolve(new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve('haha');
    }, 1000);
}), 
).then((data) => {
    console.log('프로미스 객체인 경우, resolve 된 결과를 받아 then이 실행된다.', data);
});

Promise.resolve('bar').then(data => {
    console.log('then 매서드가 없는 경우, fulfilled 된다.', data);
})

//출력값
then 매서드가 없는 경우, fulfilled 된다. bar
프로미스 객체인 경우, resolve 된 결과를 받아 then이 실행된다. hello

프로미스객체를 넣어줄 수 있고, 인자를 넣어줄 수 있다.

밑에 Promise.resolve('bar')인 부분은 Promise객체가 아닌경우 'bar'라는 값이 그대로 넘어가서 fulfilled가 된다.

이와같이 어떤객체가 Promise 객체인지 그저 데이터 객체인지 모르겠고 확실하지 않을때, 이렇게 Promise.resolve를 실행해서 넘기면 resolve가 되게 하거나 아니면 값이 바로 then으로 넘어가게 끔 유용하게 사용하면 된다.

 

 

 

ex) Promise.reject를 사용하면, catch로 연결된 rejected 상태로 변경된다.

Promise.reject(new Error('reason'))
    .then(error=>{})
    .catch(error=>{
    console.log(error);
})

다음과 같이 catch로 해서 에러를 받아오게 하는 것이다.

 

 

 

 

ex) 프로미스 객체 여러개를 생성하여, 배열로 만들어 인자로 넣고 Promise.all 을 실행하면, 배열의 모든 프로미스 객체들이 fulfilled 되었을 때, then 의 함수가 실행된다. then의 함수의 인자로 프로미스 객체들의 resolve 인자값을 배열로 돌려준다.

--> Promise.all([프로미스 객체들]); 을 이용해서 다뤄보기로 하자.

function p(ms){
    return new Promise((resolve, reject)=>{
        setTimeout(()=>{
            resolve(ms);
        }, ms);
    })
}

Promise.all([p(1000), p(2000), p(3000)]).then((messages)=>{
    console.log('모두 fulfilled 된 이후에 실행된다.', messages);
});

//출력값
모두 fulfilled 된 이후에 실행된다. (3) [1000, 2000, 3000]

다음은 p(1000), p(2000), p(3000)이 각각 전부 fulfilled된 후에 한꺼번에 then을 부르게 된다. 테스트로 ms를 인자로 바로 담아서 보내주는걸로 해보았다. 결과로 보면 각인자가 배열로 되어서 보내진걸 볼 수 있다.

만약 비동기작업을 한꺼번에 보내서 동시에 끝내게 하고싶은 일이 있다면 이런식으로 처리하는것이 좋다.

 

 

 

 

ex) 프로미스 객체 여러개를 생성하여, 배열로 만들어 인자로 넣고 Promise.race를 실행하면,

배열의 모든 프로미스 객체들 중 가장 먼저 fulfilled 된 것으로, then 의 함수가 실행된다.

then의 함수의 인자로 가장 먼저 fulfilled 된 프로미스 객체의 resolve 인자값을 돌려준다.

--> Promise.race([프로미스 객체들]); 을 이용해서 다뤄보기로 하자

function p(ms){
    return new Promise((resolve, reject)=>{
        setTimeout(()=>{
            resolve(ms);
        }, ms);
    })
}

Promise.race([p(1000), p(2000), p(3000)]).then((message)=>{
    console.log('가장빠른 하나가 fulfilled 된 이후에 실행된다.', message);
});

Promise.all은 모든 객체들이 fulfilled가 되어야지 진행됬던건데, Promise.race는 그중에서 가장빠른것부터 fulfilled되면 그때 바로 then함수가 실행된다. 사용방식은 promise.all이랑 매우 비슷하다.