Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що робить catch() у промісах?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## 1. Що робить `.catch()`

> `.catch()` - це метод у проміса, який **викликається, якщо проміс переходить у стан "відхилено" (**`rejected`**)**.
> Тобто він ловить **усі помилки**, що сталися:
>
> - всередині проміса,
> - всередині ланцюжка `.then()`,
> - або при явному `reject()`.

## 2. Синтаксис

```javascript
promise.catch(onRejected)
```

де:

- `onRejected` - функція, яка отримає об'єкт помилки.

## 3. Приклад: явне відхилення проміса

```javascript
const promise = new Promise((resolve, reject) => {
  reject("Помилка при завантаженні даних");
});

promise.catch(error => {
  console.log("Спіймано:", error);
});
```

Вивід:

```javascript
Спіймано: Помилка при завантаженні даних
```

`.catch()` спрацював, тому що проміс був **відхилений** (`reject`).

## 4. Приклад: помилка в коді автоматично викликає `.catch()`

```javascript
const promise = new Promise(() => {
  throw new Error("Щось пішло не так");
});

promise.catch(err => {
  console.log("Спіймали помилку:", err.message);
});
```

Вивід:

```javascript
Спіймали помилку: Щось пішло не так
```

> Будь-яка помилка всередині функції-виконавця (`executor`) автоматично викликає `reject`.

## 5. Приклад: обробка помилок у ланцюжку `.then()`

```javascript
Promise.resolve()
  .then(() => {
    throw new Error("Помилка в then");
  })
  .catch(error => {
    console.log("Спіймали:", error.message);
  });
```

Вивід:

```javascript
Спіймали: Помилка в then
```

> `.catch()` перехоплює помилки, навіть якщо вони сталися **в одному з попередніх** `.then()`.

## 6. `.catch()` = `.then(null, onRejected)`

Ці два варіанти повністю еквівалентні:

```javascript
promise.catch(onRejected);
promise.then(null, onRejected);
```

Обидва обробляють **відхилений** проміс.
Але `.catch()` читається простіше і використовується частіше.

## 7. Приклад: повернення значення з `.catch()`

Якщо в `.catch()` повернути значення, воно "відновлює" ланцюжок,
і наступний `.then()` отримає це значення як результат.

```javascript
Promise.reject("Помилка")
  .catch(err => {
    console.log("Спіймали:", err);
    return "Продовжуємо роботу";
  })
  .then(result => {
    console.log("Результат:", result);
  });
```

Вивід:

```javascript
Спіймали: Помилка
Результат: Продовжуємо роботу
```

> `.catch()` може не тільки перехоплювати помилки, а й **"зцілювати" ланцюжок**.

## 8. Приклад: повторне викидання помилки

Якщо з `.catch()` знову викинути помилку (`throw`),
то вона передається далі - наступному `.catch()` у ланцюжку.

```javascript
Promise.reject("Помилка 1")
  .catch(err => {
    console.log("Спіймали:", err);
    throw new Error("Помилка 2");
  })
  .catch(err => {
    console.log("Спіймали знову:", err.message);
  });
```

Вивід:

```javascript
Спіймали: Помилка 1
Спіймали знову: Помилка 2
```

## 9. Приклад: `.catch()` в асинхронних функціях

`.catch()` працює так само, як `try...catch`, але у вигляді ланцюжка промісів.

```javascript
async function getData() {
  throw new Error("Помилка в async");
}

getData().catch(err => {
  console.log("Спіймали:", err.message);
});
```

Вивід:

```javascript
Спіймали: Помилка в async
```

## 10. Приклад з `try...catch` для порівняння

```javascript
async function example() {
  try {
    await Promise.reject(new Error("Помилка в промісі"));
  } catch (err) {
    console.log("Спіймали через try...catch:", err.message);
  }
}
example();
```

Аналог `.catch()`, але в синтаксисі `async/await`.

## Підсумок

| Особливість | Опис |
|---|---|
| Коли спрацьовує | Коли проміс відхилено (`reject` або `throw`) |
| Аналогічно | `then(null, onRejected)` |
| Повертає | Новий проміс |
| Може відновити ланцюжок | Якщо повернути значення з `.catch()` |
| Може передати помилку далі | Якщо знову `throw` всередині `.catch()` |
| Працює з async/await | Аналог `try...catch` |

## Коротке порівняння:

| Ситуація | Що використовувати |
|---|---|
| Обробка помилки в ланцюжку промісів | `.catch()` |
| Обробка помилок у `async/await` | `try...catch` |
| Потрібно продовжити ланцюжок після помилки | повернути значення з `.catch()` |
| Потрібно прокинути помилку далі | `throw` всередині `.catch()` |

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати530 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.