Promise.race() 메서드

 

Promise.race()는 iterable(배열 등)에 포함된 Promise들 중 가장 먼저 완료(이행 또는 거부) 되는 Promise의 결과를 반환한다.

---

특징

1. 가장 먼저 완료된 Promise의 상태와 결과를 반환한다.
   • 이행(fulfilled) 또는 거부(rejected) 여부에 상관없이 가장 빨리 완료된 것이 반환된다.
2. 반환값은 새 Promise 객체이다.
3. 동작 중단이 아니라, 첫 번째 완료된 Promise에만 집중한다.

---

예제

두 Promise 중 더 빠른 결과 반환

 

const promise1 = new Promise((resolve, reject) => {
    setTimeout(resolve, 500, 'one'); // 500ms 후 'one' 반환
});

const promise2 = new Promise((resolve, reject) => {
    setTimeout(resolve, 100, 'two'); // 100ms 후 'two' 반환
});

Promise.race([promise1, promise2]).then((value) => {
    console.log(value); // 'two' 출력
});

• promise2가 먼저 완료되므로 Promise.race의 결과는 "two"이다.

---

Promise 중 하나가 거부될 경우

const promise1 = new Promise((resolve, reject) => {
    setTimeout(resolve, 500, 'one'); // 500ms 후 'one' 반환
});

const promise2 = new Promise((resolve, reject) => {
    setTimeout(reject, 100, 'Error in promise2'); // 100ms 후 에러 발생
});

Promise.race([promise1, promise2])
    .then((value) => {
        console.log('성공:', value);
    })
    .catch((error) => {
        console.log('실패:', error); // 'Error in promise2' 출력
    });

• promise2가 먼저 거부되므로 Promise.race의 결과는 에러 메시지 "Error in promise2"이다.

---

활용 예시

경쟁 조건 처리

서버 응답 시간이 길 경우, 타임아웃 처리:

const fetchWithTimeout = (url, timeout) => {
    const fetchPromise = fetch(url);

    const timeoutPromise = new Promise((resolve, reject) => {
        setTimeout(() => reject('Timeout exceeded'), timeout);
    });

    return Promise.race([fetchPromise, timeoutPromise]);
};

// 사용 예시
fetchWithTimeout('https:///1', 2000)
    .then((response) => response.json())
    .then((data) => console.log(data))
    .catch((error) => console.log('Error:', error));

 

---

정리

• Promise.race는 최초 완료된 Promise의 결과에만 집중한다.
• 주로 경쟁 조건 처리나 타임아웃 설정에 사용된다.