> Что такое fetch в JavaScript (JavaScript)

Уровень: junior · Роль: frontend · Категория: Технические вопросы

Компании: Avito, Purrweb

Стек: JavaScript

> Пример ответа

fetch - это встроенный в браузер API для выполнения асинхронных HTTP-запросов. Он возвращает Promise, который разрешается в объект Response. Основное преимущество перед устаревшим XMLHttpRequest - более простая и читаемая цепочка обработки.

Пример базового GET-запроса:

JAVASCRIPT
fetch('https://api.example.com/data')
  .then(response => {
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    return response.json(); // или .text(), .blob() и т.д.
  })
  .then(data => console.log(data))
  .catch(error => console.error('Fetch error:', error));

Для POST-запроса передаётся объект с настройками:

JAVASCRIPT
fetch('https://api.example.com/users', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ name: 'John' })
})
.then(res => res.json())
.then(console.log);

Важно: fetch не отклоняет Promise при HTTP-ошибках (например, 404 или 500) - он отклоняется только при сетевых сбоях. Поэтому нужно вручную проверять response.ok. Современный подход часто использует async/await для ещё более лаконичного кода.