Как обработать в промисе состояние rejected?

Обработка состояния Rejected в Promise

Для обработки состояния rejected в промисах существуют несколько основных подходов. Вот наиболее распространенные и эффективные способы:

1. Метод .catch()

Этот метод принимает функцию-обработчик, которая выполняется при отклонении промиса.

fetchData()
  .then(data => {
    console.log('Успех:', data);
  })
  .catch(error => {
    console.error('Ошибка:', error.message);
    // Можно вернуть значение по умолчанию
    return { default: 'data' };
  })
  .then(result => {
    // Обрабатываем результат (даже после catch)
    console.log('Финальный результат:', result);
  });

2. Второй аргумент в .then()

Метод .then() принимает два аргумента: для обработки успеха и для обработки ошибки.

fetchData()
  .then(
    data => {
      console.log('Успех:', data);
    },
    error => {
      console.error('Ошибка в then:', error);
      // Важно: эта обработка не перехватит ошибки из success-обработчика выше
    }
  );

3. Комбинация try/catch с async/await

Для асинхронных функций наиболее читаемым вариантом является использование try/catch.

async function processData() {
  try {
    const data = await fetchData();
    console.log('Успех:', data);
    return data;
  } catch (error) {
    console.error('Ошибка:', error);
    // Возвращаем значение по умолчанию
    return { error: 'handled', originalError: error.message };
  } finally {
    console.log('Операция завершена (успешно или с ошибкой)');
  }
}

4. Глобальная обработка неперехваченных ошибок

Для отлова неперехваченных отклонений промисов используйте глобальные обработчики:

// Для неперехваченных promise rejections
window.addEventListener('unhandledrejection', event => {
  console.error('Неперехваченный rejection:', event.reason);
  // Можно отправить в систему мониторинга
  sendToErrorMonitoring(event.reason);
  // Предотвращаем вывод в консоль браузера
  event.preventDefault();
});

// Для уже перехваченных, но позже
window.addEventListener('rejectionhandled', event => {
  console.log('Rejection был обработан позже:', event.reason);
});

Ключевые различия и рекомендации

Важные нюансы:

• Цепочка промисов: Обработчик .catch() перехватывает ошибки из всех предыдущих .then() в цепочке
• Возврат значений: Из .catch() можно вернуть значение, которое попадет в следующий .then()
• Проброс ошибок: Если нужно пробросить ошибку дальше, можно выбросить ее снова:

fetchData()
  .catch(error => {
    if (error.type === 'network') {
      // Обрабатываем сетевые ошибки
      return retryFetch();
    }
    // Пробрасываем другие ошибки дальше
    throw error;
  })
  .catch(error => {
    // Сюда попадут только неперехванные ошибки
    console.error('Критическая ошибка:', error);
  });

Паттерны обработки:

• Централизованная обработка: Создайте функцию-обертку для единообразной обработки ошибок
• Типизация ошибок: Используйте кастомные классы ошибок для лучшего управления:

class ApiError extends Error {
  constructor(message, statusCode) {
    super(message);
    this.name = 'ApiError';
    this.statusCode = statusCode;
  }
}

async function fetchWithHandling() {
  try {
    const response = await fetch('/api/data');
    if (!response.ok) {
      throw new ApiError('Ошибка API', response.status);
    }
    return await response.json();
  } catch (error) {
    if (error instanceof ApiError) {
      // Специфичная обработка API ошибок
      handleApiError(error);
    } else {
      // Обработка других ошибок
      handleGenericError(error);
    }
  }
}

Лучшие практики:

• Всегда обрабатывайте возможные отклонения промисов
• Используйте async/await с try/catch для улучшения читаемости кода
• Не забывайте про блок finally для cleanup-операций

• Избегайте "забытых" промисов без обработки ошибок
• Логируйте ошибки для последующего анализа
• Предусматривайте fallback-значения для критически важных операций

Правильная обработка состояний rejected делает код более устойчивым к ошибкам и улучшает пользовательский опыт, позволяя корректно реагировать на различные сбои в работе приложения.