[ES6+] promise.race()

promise.race()

promise.all과 사용법은 같다. 차이점은 프로미스들중 하나라도 resolve 되거나 reject되면 실행된다는 거다

그러니까 all이 and조건이라면 race는 or조건이라는거군!

예시 코드를 보면

const p1 = new Promise(resolve =>{
  setTimeout(resolve, 10000, "First");
});

const p2 = new Promise(resolve,reject =>{
  setTimeout(reject, 5000, "Noooo");
});

const p3 = new Promise(resolve =>{
  setTimeout(resolve, 3000, "Third");
});

const motherPromise = Promise.race([p1, p2, p3]);
motherPromise
  .then(values => console.log(values))
	.catch(err => console.log(err));
//Third

p3가 resolve나 reject가 가장 빠르기 때문에 p3의 값이 찍히는것이다.

어떤것이 먼저 되는지 상관없을때 race 를 쓰면 된다

Promise.race([p1,p2,p3])
.then(values => console.log(values))
.catch(err => console.log(err));

이렇게 써줘도 동일하게 작동한다!

아마 대부분 본인이 사용할 프로미스를 만들지는 않을거다.

보통 다른사람들을 위해 프로미스를 만드는 작업을 하게 될건데,

이 프로미스에서의 value들을 리턴하기 위해서는 then을 사용하면 된다

(then으로 갖다쓰면 프로미스를 만드는 방법이기 때문에 그냥 쓰면 된다)

then다음에 함수 넣어도된다(당연)

catch()

프로미스에서 에러가 생기면 catch는 그 에러를 잡아준다

const areYouHungry = new Promise((resolve, reject) => {
  setTimeout(reject, 3000, "no i'm not");
})

areYouHungry.then(value => console.log(value));
//3초뒤에 Uncaught (in promise) no i'm not 이라는 에러가 뜸

이때 catch를 넣어주자

areYouHungry
  .then(value => console.log(value))
  .catch(value => console.log(value));
//3초뒤에 콘솔에 no i'm not으로 값을 찍는다

가끔 then이 먼저 실행되고 이후에 catch가 실행된다고 생각하는 사람들이 있다는데 (나임)

그렇지 않다고 한다…(오…)

이 두개는 각기 다른 상황에서 실행되는 거라고 한다

그래서 만약 then이 실행되면 catch는 절대 실행되지 않고, catch가 실행되면 then은 절대 실행되지 않는다

노마드코더의 ‘ES6의 정석’을 듣고 정리 =)

promise.race()

catch()

Share this post