JavaScript Promise.race() — перша обіцянка, що завершилась

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

правити

Загальний опис

Класичне застосування — таймаут. Ставимо на перегони запит і затримку: якщо запит не встиг за три секунди, перемагає затримка, і ми чесно кажемо «сервер не відповідає».

Важливо розуміти: програвши перегони, обіцянка не скасовується. Запит усе одно долетить до сервера й повернеться — просто його результат уже нікому не потрібен. Щоб справді обірвати запит, потрібен AbortController.

Перша ж помилка теж виграє перегони — тобто race падає, якщо найшвидшою виявилась невдача.

правити

Порада

Для таймауту fetch сьогодні є коротший шлях: AbortSignal.timeout(3000) — він і запит обірве, а не лише перестане його чекати.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
race	32+	29+	8+	19+	12+	-

Підтримка: мобільні переглядачі

Переглядач
race	32+	yes	yes	8+

Приклади

+ запропонувати свій приклад у пісочниці

// top-level await працює лише в модулях — тут той самий код в async-функції
(async () => {
    const timeout = ms => new Promise((_, reject) =>
        setTimeout(() => reject(new Error('Час вийшов')), ms)
    );

    try {
        const data = await Promise.race([
            fetch('/api/slow').then(r => r.json()),
            timeout(3000),
        ]);

        console.log(data);
    } catch (error) {
        console.error(error.message); // 'Час вийшов'
    }

    // увага: програвши перегони, запит НЕ скасовується —
    // для справжнього обриву потрібен AbortController
})();