JavaScript метод Promise.race()

Определение и применение

JavaScript метод .race() объекта Promise возвращает объект Promise, который имеет состояние rejected (выполнение отклонено), или fulfilled (успешное выполнение). Результат выполнения зависит от того, с каким результатом завершается выполнение первого из переданных объектов Promise.

Метод возвращает обещание, которое имеет состояние pending (ожидание), асинхронно возвращающее значение первого обещания в данной итерации для разрешения, или отклонения.

Поддержка браузерами

Метод	Chrome	Firefox	Opera	Safari	IExplorer	Edge
.race()	32.0	29.0	19.0	8.0	Нет	Да

JavaScript синтаксис:

Promise.race(iterable);

iterable - Array

Спецификация

Значения параметров

Пример использования

Базовое использования метода

const promise = new Promise(function(resolve, reject) {
    setTimeout(resolve, 2000, "promise1"); // изменяем состояние объекта на fulfilled (успешное выполнение) через 2 секунды
});

const promise2 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 1000, "promise2"); // изменяем состояние объекта на fulfilled (успешное выполнение) через 1 секунду
});

Promise.race([promise, promise2]) // ожидаем выполнение первого из переданных в массиве обещаний
                .then(val => console.log(val)); // обработчик для успешного выполнения

// promise2

В этом примере мы инициализировали две переменные, которые содержат объект Promise, который изменяет состояние объекта на fulfilled (успешное выполнение) через 2 секунды в первом случае, и через одну секунду во втором.

С использованием метода .race() объекта Promise мы принимаем массив, который содержит ссылку на два обещания, результат выполнения этого метода зависит от того с каким результатом завершится выполнение первого из переданных обещаний, в нашем случае это второе обещание (promise2), которое выполнится на секунду раньше другого с указанным значением.

С использованием метода then() мы добавили обработчик, вызываемый когда объект Promise имеет состояние fulfilled (успешное выполнение) и выводим в консоль полученное значение.

Далее мы с Вами рассмотрим пример в котором обещание будет отклонено:

const promise = new Promise(function(resolve, reject) {
    setTimeout(resolve, 2000, "promise1"); // изменяем состояние объекта на fulfilled (успешное выполнение) через 2 секунды
});

const promise2 = new Promise(function(resolve, reject) {
    setTimeout(reject, 1000, new Error("Обещание отклонено")); // изменяем состояние объекта на rejected (выполнение отклонено) через 1 секунду
});

Promise.race([promise, promise2]) // ожидаем выполнение первого из переданных в массиве обещаний
                .then(val => console.log(val), // обработчик для успешного выполнения
                           err => console.log(err.message)); // обработчик для случая, когда выполнение отклонено

// Обещание отклонено

По аналогии с предыдущим примером мы инициализировали две переменные, которые содержат объект Promise, который изменяет состояние объекта на fulfilled (успешное выполнение) через 2 секунды в первой переменной. Обратите внимание, что с помощью метода reject() мы изменяем значение объекта Promise на rejected (выполнение отклонено) через 1 секунду во второй переменной.

С использованием метода .race() объекта Promise мы принимаем массив, который содержит ссылку на два обещания, результат выполнения этого метода зависит от того с каким результатом завершится выполнение первого из переданных обещаний, в нашем случае это второе обещание (promise2), которое будет отклонено через секунду раньше другого с указанной ошибкой. В результате чего возвращается объект Promise, который имеет состояние rejected (выполнение отклонено).

С использованием метода then() мы добавили обработчики, вызываемые когда объект Promise имеет состояние fulfilled (успешное выполнение), или rejected (выполнение отклонено). В нашем случае срабатывает обработчик для отклоненного выполнения, и выводит информацию об ошибке в консоль.

Нюансы использования метода

Promise.race(["Тест", "Тест2"])
                .then(val => console.log(val)); // обработчик для успешного выполнения

// Тест

Promise.race([Promise.resolve(1), Promise.resolve(2)])
                .then(val => console.log(val)); // обработчик для успешного выполнения

// 1

Promise.race([]); // обещание будет вечно в состоянии ожидания

В этом примере мы рассмотрели основные нюансы использования метода .race(), например, если объект содержит одно, или несколько значений, которые не являются обещаниями, то метод разрешится с первым из этих значений. По аналогии метод разрешится с первым из значений, если объект содержит уже разрешенное, или отклоненное обещание.

Если переданный объект пуст, то возвращенное обещание будет вечно в состоянии ожидания (pending). Учитывайте эти нюансы при использовании метода .race() в своей работе.