логотип PurpleSchool
Иконка входа
Вход
  • Обучение
  • Войти
логотип PurpleSchool

Метод Promise.race() в JavaScript

Автор

Дмитрий Нечаев

В JavaScript промисы являются одним из основных способов работы с асинхронностью. Они позволяют обрабатывать результаты асинхронных операций, таких как загрузка данных или выполнение задач, которые требуют некоторого времени на завершение. Стандартная библиотека JavaScript предлагает несколько методов для управления группами промисов, одним из которых является Promise.race(). Данный метод особенно полезен, когда нужно выполнять несколько асинхронных операций параллельно и реагировать только на самую быструю из них.

Что такое Promise.race()

Promise.race(iterable) — это метод, который принимает итерируемый объект (например, массив) промисов и возвращает новый промис, который исполнится или отклонится, как только из переданных промисов исполнится или отклонится первый.

Использование Promise.race() может быть целесообразным в ситуациях, когда результат нужен срочно и его предоставление одним из нескольких источников является приемлемым. Такой подход часто используется в задачах с тайм-аутами или в сценариях, когда первый ответ от нескольких серверов является достаточным.

Пример использования Promise.race()

Давайте рассмотрим пример использования Promise.race() на практике. Предположим, у нас есть две асинхронные функции, которые возвращают промисы. Мы хотим отправить два запроса к разным API и обработать только тот, который вернет результат первым.

// Функция, имитирующая асинхронный запрос с задержкой
function fetchDataWithDelay(url, delay) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(`Данные с ${url}`);
        }, delay);
    });
}

// Создаем два промиса с различными задержками
let promise1 = fetchDataWithDelay("url1.com", 500); // Задержка 500 мс
let promise2 = fetchDataWithDelay("url2.com", 300); // Задержка 300 мс

// Используем Promise.race для обработки первого исполнившегося промиса
Promise.race([promise1, promise2]).then(result => {
    console.log("Полученный результат:", result);
}).catch(error => {
    console.log("Ошибка:", error);
});

В данном случае, в консоль будет выведено "Полученный результат: Данные с url2.com", так как промис promise2 исполнится первым из-за меньшей задержки.

Применение с тайм-аутом

Promise.race() также часто используется для реализации тайм-аута для асинхронных операций. Если заданная операция не завершается в течение определенного времени, можно отклонить промис с помощью тайм-аута.

function fetchData(url) {
    return new Promise(resolve => setTimeout(() => resolve(`Данные с ${url}`), 1000));
}

let fetchDataPromise = fetchData("example.com");
let timeoutPromise = new Promise((resolve, reject) => {
    setTimeout(() => reject(new Error("Тайм-аут запроса")), 500);
});

Promise.race([fetchDataPromise, timeoutPromise]).then(data => {
    console.log("Данные:", data);
}).catch(error => {
    console.log("Ошибка:", error.message);
});

В этом примере, если запрос не будет выполнен за 500 мс, будет выведено сообщение об ошибке

"Ошибка: Тайм-аут запроса".

Заключение

Метод Promise.race() является мощным инструментом для управления конкурирующими асинхронными операциями в JavaScript. Он позволяет эффективно обрабатывать сценарии, где необходимо получить первый результат из множества источников или установить тайм-аут для асинхронной операции. Используйте его, когда нужно быстро реагировать на первые изменения без необходимости дожидаться завершения всех асинхронных процессов.

изображение курса

Основы JavaScript

Антон Ларичев
иконка часов18 часов лекций
иконка звёздочки рейтинга4.8
Frontend
Backend
Mobile
2 999 ₽
Основы JavaScript