> Что такое AbortController и метод abort в JavaScript (JavaScript)

Короткий ответ

AbortController - это встроенный объект в JavaScript, который позволяет отменять асинхронные операции, такие как fetch-запросы. Метод abort() генерирует событие abort и устанавливает флаг signal.aborted в true. Signal передаётся в асинхронную операцию, и она может корректно завершиться при вызове abort().

Подробное объяснение

AbortController состоит из двух частей: сам контроллер и его свойство signal. Signal - это объект типа AbortSignal, который можно передать в поддерживающие отмену API (например, fetch, addEventListener, ReadableStream). При вызове controller.abort():

• Свойство signal.aborted становится true
• Генерируется событие abort на signal
• Все операции, подписанные на этот signal, получают уведомление и прерываются

Для fetch это означает, что промис отклоняется с ошибкой AbortError. Можно также передавать один signal в несколько запросов - все они отменятся одновременно.

На практике

AbortController полезен в реальных сценариях:

• Отмена запроса при уходе пользователя со страницы
• Отмена предыдущего запроса при новом поиске (debounce с отменой)
• Очистка таймеров и слушателей событий при размонтировании компонента
• Прерывание загрузки файлов или стримов

Важно обрабатывать ошибку AbortError отдельно от других ошибок сети, чтобы не показывать пользователю сообщение об отмене как об ошибке.

Пример кода

JAVASCRIPT
const controller = new AbortController();
const signal = controller.signal;

// Отмена через 3 секунды
setTimeout(() => controller.abort(), 3000);

fetch('https://api.example.com/data', { signal })
  .then(response => response.json())
  .catch(err => {
    if (err.name === 'AbortError') {
      console.log('Запрос был отменён');
    } else {
      console.error('Ошибка запроса:', err);
    }
  });

Как отвечать на собеседовании

Начни с простого определения: AbortController позволяет отменять асинхронные операции. Объясни, что он состоит из контроллера и signal, который передаётся в API. Приведи пример с fetch и обработкой ошибки отмены. Упомяни, что signal можно использовать повторно или комбинировать с несколькими операциями. Если спросят про альтернативы - скажи, что до AbortController приходилось использовать сторонние библиотеки или костыли.

Что проверяет интервьюер

• Понимание асинхронности и управления потоками
• Знание современного API браузера
• Умение обрабатывать ошибки корректно
• Понимание паттерна сигналов (signal pattern)
• Способность применять на практике в реальных сценариях

Типичные ошибки

• Не обрабатывать AbortError отдельно, показывая пользователю сообщение об ошибке при отмене
• Пытаться повторно использовать отменённый signal (нужно создавать новый AbortController)
• Забывать передать signal в fetch или другой API
• Вызывать abort() несколько раз - это безопасно, но может привести к лишним событиям
• Путать AbortController с отменой промисов (промисы нельзя отменить, только операции, которые их поддерживают)