Асинхронный JavaScript: Промисы, Async/Await и Fetch API

// Пример синхронного кода, блокирующего интерфейс
function getDataSync() {
    // Эта функция занимает 5 секунд
    const startTime = new Date().getTime();
    while (new Date().getTime() < startTime + 5000) {
        // Блокируем поток выполнения на 5 секунд
    }
    return "Данные получены!";
}
 
console.log("Начинаем запрос...");
const result = getDataSync(); // Здесь весь интерфейс замрёт на 5 секунд
console.log(result);
console.log("Запрос завершен.");

// Пример асинхронного кода с использованием колбэков
function getDataAsync(callback) {
    setTimeout(() => {
        callback("Данные получены асинхронно!");
    }, 5000);
}
 
console.log("Начинаем асинхронный запрос...");
getDataAsync(function(result) {
    console.log(result);
});
console.log("Запрос отправлен, продолжаем работу.");

getData(function(a) {
    getMoreData(a, function(b) {
        getEvenMoreData(b, function(c) {
            getYetEvenMoreData(c, function(d) {
                getFinalData(d, function(result) {
                    console.log("Получен финальный результат:", result);
                });
            });
        });
    });
});

// Псевдокод работы Event Loop
while (true) {
    // 1. Выполнить весь код из стека вызовов
    while (callStack.isNotEmpty()) {
        executeCurrentFunction();
    }
    
    // 2. Проверить очередь микрозадач и выполнить их
    while (microtaskQueue.isNotEmpty()) {
        executeNextMicrotask();
    }
    
    // 3. Проверить очередь макрозадач и выполнить одну
    if (taskQueue.isNotEmpty()) {
        executeNextTask();
    }
    
    // 4. Отрисовка пользовательского интерфейса
    renderUIIfNeeded();
}

console.log('Скрипт начался');
 
setTimeout(() => {
  console.log('Таймер 1');
}, 0);
 
Promise.resolve()
  .then(() => console.log('Промис 1'))
  .then(() => console.log('Промис 2'));
 
setTimeout(() => {
  console.log('Таймер 2');
}, 0);
 
console.log('Скрипт завершился');

Скрипт начался
Скрипт завершился
Промис 1
Промис 2
Таймер 1
Таймер 2

// Пример использования Performance API в коде
performance.mark('start');
 
fetchData()
  .then(processData)
  .then(() => {
    performance.mark('end');
    performance.measure('fetch and process', 'start', 'end');
  });

console.time('asyncOperation');
 
fetchData()
  .then(result => {
    console.timeEnd('asyncOperation');
    console.log(result);
  });

const myPromise = new Promise((resolve, reject) => {
  // Асинхронная операция
  const success = true;
  
  if (success) {
    resolve('Операция выполнена успешно!');
  } else {
    reject(new Error('Что-то пошло не так...'));
  }
});

myPromise
  .then(result => {
    console.log('Успех:', result);
    return 'Дополнительная обработка';
  })
  .then(newResult => {
    console.log('Еще обработка:', newResult);
  })
  .catch(error => {
    console.error('Ошибка:', error.message);
  })
  .finally(() => {
    console.log('Выполняется всегда, независимо от результата');
  });

fetchUserData(userId)
  .then(userData => {
    return fetchUserPosts(userData.id);
  })
  .then(posts => {
    return fetchPostComments(posts[0].id);
  })
  .then(comments => {
    console.log('Комментарии к первому посту:', comments);
  })
  .catch(error => {
    console.error('Произошла ошибка в цепочке:', error);
  });

fetchData()
  .then(data => {
    // Если здесь будет ошибка или Promise.reject
    const processed = processData(data);
    return processed;
  })
  .then(processed => {
    // Этот блок будет пропущен при ошибке выше
    displayData(processed);
  })
  .catch(error => {
    // Сюда попадут все ошибки из предыдущих блоков
    console.error('Ошибка в цепочке:', error);
    showErrorMessage();
  });

Promise.resolve('данные')
  .then(data => {
    throw new Error('Что-то пошло не так!');
    // Или return Promise.reject(new Error('...'));
  })
  .catch(error => {
    // Оба типа ошибок будут перехвачены здесь
    console.error(error.message);
  });

// Создаёт выполненный промис с результатом 42
const resolved = Promise.resolve(42);
 
// Создаёт отклонённый промис с указанной ошибкой
const rejected = Promise.reject(new Error('Отказано!'));

function checkValue(value) {
  if (typeof value === 'number') {
    return Promise.resolve(value * 2);
  } else {
    return Promise.reject(new Error('Ожидалось число'));
  }
}

const promises = [
  fetch('/api/users'),
  fetch('/api/posts'),
  fetch('/api/comments')
];
 
Promise.all(promises)
  .then(responses => {
    // Массив результатов в том же порядке, что и входные промисы
    return Promise.all(responses.map(response => response.json()));
  })
  .then(data => {
    const [users, posts, comments] = data;
    // Используем все данные, полученные параллельно
  })
  .catch(error => {
    // Если хотя бы один промис отклонён, 
    // весь Promise.all будет отклонён
    console.error('Ошибка в одном из запросов:', error);
  });

const timeoutPromise = new Promise((_, reject) => {
  setTimeout(() => reject(new Error('Timeout!')), 5000);
});
 
const dataPromise = fetch('/api/data');
 
Promise.race([dataPromise, timeoutPromise])
  .then(result => {
    // Вызовется, если fetch завершится быстрее таймаута
    console.log('Данные получены вовремя:', result);
  })
  .catch(error => {
    // Вызовется, если произойдёт таймаут или ошибка в fetch
    console.error('Ошибка или таймаут:', error);
  });

const promises = [
  fetch('/api/users').then(r => r.json()),
  fetch('/api/nonexistent').then(r => r.json()),
  fetch('/api/posts').then(r => r.json())
];
 
Promise.allSettled(promises)
  .then(results => {
    // results - массив объектов с информацией о результате каждого промиса
    results.forEach((result, index) => {
      if (result.status === 'fulfilled') {
        console.log(`Промис ${index} выполнен с результатом:`, result.value);
      } else {
        console.log(`Промис ${index} отклонён с ошибкой:`, result.reason);
      }
    });
    
    // Можно обработать успешные результаты, игнорируя ошибки
    const successfulData = results
      .filter(result => result.status === 'fulfilled')
      .map(result => result.value);
    
    console.log('Успешно полученные данные:', successfulData);
  });

const promises = [
  fetch('/api/slow-server').then(r => r.json()),
  fetch('/api/fast-server').then(r => r.json()),
  fetch('/api/backup-server').then(r => r.json())
];
 
Promise.any(promises)
  .then(result => {
    // Получим результат от самого быстрого сервера
    console.log('Первый успешный результат:', result);
  })
  .catch(errors => {
    // AggregateError - новый тип ошибки, содержащий массив всех ошибок
    console.error('Все промисы были отклонены:', errors);
  });

// Функция с колбэками
function getDataWithCallback(id, callback) {
  setTimeout(() => {
    if (id > 0) {
      callback(null, { id, name: [INLINE]Item ${id}[/INLINE] });
    } else {
      callback(new Error('Invalid ID'));
    }
  }, 1000);
}
 
// Промисифицированная версия
function getDataWithPromise(id) {
  return new Promise((resolve, reject) => {
    getDataWithCallback(id, (error, data) => {
      if (error) {
        reject(error);
      } else {
        resolve(data);
      }
    });
  });
}
 
// Использование
getDataWithPromise(42)
  .then(data => console.log('Данные:', data))
  .catch(error => console.error('Ошибка:', error));

function promisify(fn) {
  return function(...args) {
    return new Promise((resolve, reject) => {
      fn(...args, (err, result) => {
        if (err) reject(err);
        else resolve(result);
      });
    });
  };
}
 
// Использование
const getDataPromised = promisify(getDataWithCallback);
getDataPromised(123).then(data => console.log(data));

// Неправильно:
function fetchData() {
  fetch('/api/data')  // Этот промис никуда не возвращается!
    .then(response => response.json())
    .then(data => {
      return data;  // Этот return бесполезен
    });
}
 
// Правильно:
function fetchData() {
  return fetch('/api/data')
    .then(response => response.json());
}

// Неправильно:
fetchUser(userId)
  .then(user => {
    fetchPosts(user.id)
      .then(posts => {
        fetchComments(posts[0].id)
          .then(comments => {
            console.log(comments);
          });
      });
  });
 
// Правильно - используйте цепочку промисов:
fetchUser(userId)
  .then(user => fetchPosts(user.id))
  .then(posts => fetchComments(posts[0].id))
  .then(comments => console.log(comments));

// Неправильно:
fetchData().then(data => processData(data));
 
// Правильно:
fetchData()
  .then(data => processData(data))
  .catch(error => console.error('Ошибка при получении или обработке данных:', error));

// Неправильно:
function processData(data) {
  return new Promise((resolve, reject) => {
    resolve(data.map(item => item.value * 2));
  });
}
 
// Правильно:
function processData(data) {
  return Promise.resolve(data.map(item => item.value * 2));
}
 
// Или еще проще:
function processData(data) {
  return data.map(item => item.value * 2);
  // .then автоматически обернет результат в промис
}

function fetchWithTimeout(url, timeout = 5000) {
  const timeoutPromise = new Promise((_, reject) => {
    setTimeout(() => reject(new Error(`Запрос к ${url} превысил лимит ожидания ${timeout}мс`)), timeout);
  });
  
  return Promise.race([
    fetch(url),
    timeoutPromise
  ]);
}
 
fetchWithTimeout('/api/data', 3000)
  .then(response => response.json())
  .then(data => console.log('Данные получены вовремя:', data))
  .catch(error => console.error('Ошибка или таймаут:', error.message));

function fetchWithAbort(url, timeout = 5000) {
  const controller = new AbortController();
  const { signal } = controller;
  
  // Устанавливаем таймер для прерывания запроса
  const timer = setTimeout(() => controller.abort(), timeout);
  
  return fetch(url, { signal })
    .then(response => {
      clearTimeout(timer); // Очищаем таймер при успешном запросе
      return response.json();
    })
    .catch(error => {
      if (error.name === 'AbortError') {
        throw new Error(`Запрос к ${url} был прерван по таймауту`);
      }
      throw error;
    });
}

console.log('Синхронный код 1');
 
setTimeout(() => console.log('Таймер 1 (макротаска)'), 0);
 
Promise.resolve()
  .then(() => console.log('Промис 1 (микротаска)'))
  .then(() => console.log('Промис 2 (микротаска)'));
 
console.log('Синхронный код 2');
 
// Вывод:
// Синхронный код 1
// Синхронный код 2
// Промис 1 (микротаска)
// Промис 2 (микротаска)
// Таймер 1 (макротаска)

// Использование промисов
function getUserData() {
  return fetchUser(userId)
    .then(user => {
      return fetchPosts(user.id)
        .then(posts => {
          return {
            user,
            posts
          };
        });
    });
}
 
// Использование async/await
async function getUserData() {
  const user = await fetchUser(userId);
  const posts = await fetchPosts(user.id);
  return { user, posts };
}

async function hello() {
  return "Привет, мир!";
}
 
// Эквивалентно
function hello() {
  return Promise.resolve("Привет, мир!");
}
 
hello().then(message => console.log(message)); // "Привет, мир!"

async function showUserPosts() {
  try {
    // Ждём выполнения первого промиса
    const user = await fetchUser(userId);
    
    // Только после получения пользователя запрашиваем его посты
    const posts = await fetchPosts(user.id);
    
    // Отображаем результаты
    displayUserInfo(user);
    displayPosts(posts);
  } catch (error) {
    // Обработка любых ошибок
    showError("Не удалось загрузить данные", error);
  }
}

// Обработка ошибок с промисами
function getUserData() {
  return fetchUser(userId)
    .then(user => fetchPosts(user.id))
    .then(posts => {
      // Логика обработки данных
      return processData(posts);
    })
    .catch(error => {
      console.error("Ошибка:", error);
      return defaultData;
    });
}
 
// Обработка ошибок с async/await
async function getUserData() {
  try {
    const user = await fetchUser(userId);
    const posts = await fetchPosts(user.id);
    
    // Логика обработки данных
    return processData(posts);
  } catch (error) {
    console.error("Ошибка:", error);
    return defaultData;
  }
}

async function getUserData() {
  let user;
  try {
    user = await fetchUser(userId);
  } catch (error) {
    console.error("Ошибка при получении данных пользователя:", error);
    user = getDefaultUser();
  }
  
  try {
    const posts = await fetchPosts(user.id);
    return processData(posts);
  } catch (error) {
    console.error("Ошибка при получении постов:", error);
    return getDefaultPosts();
  }
}

// До
function loadArticle(id) {
  return fetchArticle(id)
    .then(article => {
      return fetchComments(article.id)
        .then(comments => {
          article.comments = comments;
          return fetchAuthor(article.authorId)
            .then(author => {
              article.author = author;
              return article;
            });
        });
    })
    .catch(error => {
      console.error("Ошибка загрузки статьи:", error);
      throw error;
    });
}
 
// После
async function loadArticle(id) {
  try {
    const article = await fetchArticle(id);
    const comments = await fetchComments(article.id);
    article.comments = comments;
    const author = await fetchAuthor(article.authorId);
    article.author = author;
    return article;
  } catch (error) {
    console.error("Ошибка загрузки статьи:", error);
    throw error;
  }
}

// Неэффективно: последовательное выполнение
async function loadData() {
  const users = await fetchUsers();
  const posts = await fetchPosts(); // Ждёт завершения fetchUsers
  const comments = await fetchComments(); // Ждёт завершения fetchPosts
  return { users, posts, comments };
}

// Эффективно: параллельное выполнение независимых запросов
async function loadData() {
  const usersPromise = fetchUsers();
  const postsPromise = fetchPosts();
  const commentsPromise = fetchComments();
  
  // Ждём выполнения всех промисов
  const users = await usersPromise;
  const posts = await postsPromise;
  const comments = await commentsPromise;
  
  return { users, posts, comments };
}
 
// Или ещё компактнее с использованием Promise.all
async function loadData() {
  const [users, posts, comments] = await Promise.all([
    fetchUsers(),
    fetchPosts(),
    fetchComments()
  ]);
  
  return { users, posts, comments };
}

// Последовательное выполнение (каждый запрос ждёт завершения предыдущего)
async function fetchAllUserData(userIds) {
  const results = [];
  for (const id of userIds) {
    const userData = await fetchUserData(id);
    results.push(userData);
  }
  return results;
}
 
// Параллельное выполнение (все запросы запускаются одновременно)
async function fetchAllUserData(userIds) {
  const promises = userIds.map(id => fetchUserData(id));
  return Promise.all(promises);
}

// Асинхронный генератор
async function* asyncGenerator() {
  yield await Promise.resolve(1);
  yield await Promise.resolve(2);
  yield await Promise.resolve(3);
}
 
// Использование асинхронного генератора
async function consumeGenerator() {
  for await (const value of asyncGenerator()) {
    console.log(value);
  }
}
 
// Результат: 1, 2, 3

// Раньше приходилось писать так:
(async function() {
  const response = await fetch('/api/config');
  const config = await response.json();
  initApp(config);
})();
 
// Теперь можно просто:
// файл: app.js (с типом module)
const response = await fetch('/api/config');
const config = await response.json();
initApp(config);

// config.js
export const settings = await (await fetch('/api/settings')).json();
 
// dataService.js
import { settings } from './config.js';
// Здесь уже доступны настройки, загруженные в config.js
console.log(settings.apiKey);

// Плохо: блокирует поток
async function processData() {
  const data = await fetchLargeDataset();
  
  // Тяжёлые вычисления, блокирующие рендеринг
  for (let i = 0; i < 1000000; i++) {
    data.items[i] = performComplexCalculation(data.items[i]);
  }
  
  return data;
}
 
// Лучше: разбить на порции с использованием setTimeout
async function processDataChunked() {
  const data = await fetchLargeDataset();
  const chunkSize = 1000;
  
  for (let i = 0; i < data.items.length; i += chunkSize) {
    await new Promise(resolve => {
      setTimeout(() => {
        processChunk(data.items, i, Math.min(i + chunkSize, data.items.length));
        resolve();
      }, 0);
    });
  }
  
  return data;
}

// Простая реализация кэширования с помощью замыкания
function createAsyncCache(fetchFn) {
  const cache = new Map();
  
  return async function(key) {
    if (cache.has(key)) {
      return cache.get(key);
    }
    
    const result = await fetchFn(key);
    cache.set(key, result);
    return result;
  };
}
 
// Использование
const cachedFetchUser = createAsyncCache(fetchUser);
 
// Первый вызов — реальный запрос
const user1 = await cachedFetchUser(42);
 
// Второй вызов — мгновенный результат из кэша
const user2 = await cachedFetchUser(42);

async function loadPageData() {
  // Критически важные данные загружаем первыми
  const criticalData = await fetchCriticalData();
  renderCriticalUI(criticalData);
  
  // Второстепенные данные загружаем параллельно
  const [secondaryData, analytics, translations] = await Promise.all([
    fetchSecondaryData(),
    fetchAnalytics(),
    fetchTranslations()
  ]);
  
  // Обновляем UI по мере получения данных
  renderSecondaryUI(secondaryData);
  initAnalytics(analytics);
  applyTranslations(translations);
}

// Промис-код с малоинформативным стеком ошибок
function fetchData() {
  return fetch('/api/data')
    .then(response => response.json())
    .then(data => processData(data)); // Ошибка здесь
}
 
function processData(data) {
  // Стек не покажет связь с fetchData
  return data.nonExistentProperty.value;
}

// Async/await код с информативным стеком ошибок
async function fetchData() {
  const response = await fetch('/api/data');
  const data = await response.json();
  return processData(data); // Видно в стеке
}
 
function processData(data) {
  return data.nonExistentProperty.value;
}

async function complexOperation() {
  const userData = await fetchUser();
  // Можно поставить точку останова здесь
  const filteredData = filterUserData(userData);
  
  const enrichedData = await enrichData(filteredData);
  // И здесь
  return transformData(enrichedData);
}

class DataService {
  constructor(baseUrl) {
    this.baseUrl = baseUrl;
    
    // Необходимо привязать контекст
    this.fetchData = this.fetchData.bind(this);
  }
  
  async fetchData(endpoint) {
    // this.baseUrl будет undefined без привязки
    const url = `${this.baseUrl}/${endpoint}`;
    const response = await fetch(url);
    return response.json();
  }
}

async function trackedFetch(url, options = {}) {
  const start = performance.now();
  
  try {
    showLoader(url);
    
    const response = await fetch(url, options);
    const data = await response.json();
    
    const duration = performance.now() - start;
    logMetric('fetch-duration', { url, duration, success: true });
    
    return data;
  } catch (error) {
    const duration = performance.now() - start;
    logMetric('fetch-duration', { url, duration, success: false, error: error.message });
    
    throw error;
  } finally {
    hideLoader(url);
  }
}

fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Ошибка:', error));

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error('Ошибка:', error);
  }
}

// Получение и обработка изображения
async function fetchImage() {
  const response = await fetch('https://example.com/image.jpg');
  const imageBlob = await response.blob();
  const imageURL = URL.createObjectURL(imageBlob);
  
  const imgElement = document.createElement('img');
  imgElement.src = imageURL;
  document.body.appendChild(imgElement);
}
 
// Получение текстового файла
async function fetchTextFile() {
  const response = await fetch('https://example.com/data.txt');
  const text = await response.text();
  console.log(text);
}

async function postData(url, data) {
  const response = await fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': 'Bearer ' + token
    },
    body: JSON.stringify(data)
  });
  
  return response.json();
}
 
// Использование
const userData = { name: 'Иван', email: 'ivan@example.com' };
const result = await postData('/api/users', userData);

const headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('X-Custom-Header', 'custom-value');
 
// Проверка наличия заголовка
if (headers.has('Content-Type')) {
  console.log('Заголовок Content-Type установлен');
}
 
// Получение значения заголовка
console.log(headers.get('X-Custom-Header')); // 'custom-value'
 
// Использование в fetch
fetch('/api/data', {
  headers: headers
});

async function submitForm(formElement) {
  const formData = new FormData(formElement);
  
  // Можно добавить дополнительные поля
  formData.append('timestamp', Date.now());
  
  const response = await fetch('/api/submit', {
    method: 'POST',
    body: formData
    // Заголовок Content-Type устанавливается автоматически
  });
  
  return response.json();
}
 
// Использование
const form = document.querySelector('#contact-form');
form.addEventListener('submit', async function(event) {
  event.preventDefault();
  const result = await submitForm(this);
  showSuccessMessage(result);
});

async function fetchWithErrorHandling(url) {
  const response = await fetch(url);
  
  if (!response.ok) {
    // Создаём ошибку с информацией о статусе
    throw new Error(`HTTP ошибка! Статус: ${response.status}`);
  }
  
  return await response.json();
}
 
// Альтернативный подход с проверкой конкретных статусов
async function fetchWithStatusCheck(url) {
  const response = await fetch(url);
  
  if (response.status === 404) {
    throw new Error('Ресурс не найден');
  } else if (response.status === 401) {
    redirectToLogin();
    throw new Error('Требуется авторизация');
  } else if (!response.ok) {
    throw new Error('Ошибка сети');
  }
  
  return await response.json();
}

async function fetchWithTimeout(url, timeout = 5000) {
  // Создаём контроллер для возможности отмены
  const controller = new AbortController();
  const { signal } = controller;
  
  // Устанавливаем таймер для автоматической отмены
  const timeoutId = setTimeout(() => controller.abort(), timeout);
  
  try {
    const response = await fetch(url, { signal });
    clearTimeout(timeoutId); // Отменяем таймаут при успешном ответе
    
    if (!response.ok) {
      throw new Error(`HTTP ошибка: ${response.status}`);
    }
    
    return await response.json();
  } catch (error) {
    if (error.name === 'AbortError') {
      throw new Error(`Запрос к ${url} был отменён из-за превышения таймаута`);
    }
    throw error;
  }
}
 
// Пример ручной отмены
const controller = new AbortController();
const { signal } = controller;
 
const fetchPromise = fetch('/api/large-data', { signal });
 
// Отмена при клике на кнопку
document.querySelector('#cancel-button').addEventListener('click', () => {
  controller.abort();
});

// XMLHttpRequest
const xhr = new XMLHttpRequest();
xhr.open('GET', '/api/data', true);
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    const data = JSON.parse(xhr.responseText);
    console.log(data);
  }
};
xhr.send();
 
// Fetch
fetch('/api/data')
  .then(response => response.json())
  .then(data => console.log(data));

// Axios автоматически преобразует JSON и имеет встроенную проверку статусов
axios.get('/api/data')
  .then(response => console.log(response.data)) // Сразу получаем данные
  .catch(error => console.error('Ошибка:', error)); // Автоматически отклоняется при ошибках HTTP
 
// Встроенный мониторинг прогресса загрузки
axios.get('/api/large-file', {
  onDownloadProgress: progressEvent => {
    const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
    console.log(`Загружено: ${percentCompleted}%`);
  }
});

async function downloadWithProgress(url) {
  const response = await fetch(url);
  const reader = response.body.getReader();
  
  // Получаем общий размер
  const contentLength = +response.headers.get('Content-Length');
  
  // Читаем данные по частям
  let receivedLength = 0;
  let chunks = [];
  
  while(true) {
    const {done, value} = await reader.read();
    
    if (done) {
      break;
    }
    
    chunks.push(value);
    receivedLength += value.length;
    
    // Вычисляем и выводим прогресс
    const progress = ((receivedLength / contentLength) * 100).toFixed(2);
    console.log(`Загружено: ${progress}%`);
  }
  
  // Объединяем все фрагменты в единый массив
  const allChunks = new Uint8Array(receivedLength);
  let position = 0;
  
  for(const chunk of chunks) {
    allChunks.set(chunk, position);
    position += chunk.length;
  }
  
  return allChunks;
}

// Запрос к другому домену
fetch('https://api.другой-сайт.com/data', {
  // Важный параметр для кросс-доменных запросов с аутентификацией
  credentials: 'include', // Отправляет куки на другой домен
  
  // Также можно использовать 'same-origin' или 'omit'
})
.then(response => response.json())
.catch(error => {
  // Обработка CORS-ошибок
  if (error instanceof TypeError && error.message.includes('CORS')) {
    console.error('CORS-ошибка: сервер не разрешает кросс-доменные запросы');
  }
});

// Потоковая обработка текстовых данных
async function streamProcess(url) {
  const response = await fetch(url);
  const reader = response.body
    .pipeThrough(new TextDecoderStream())
    .getReader();
  
  while (true) {
    const {value, done} = await reader.read();
    if (done) break;
    
    // Обрабатываем каждый фрагмент данных
    processTextChunk(value);
  }
}

// Использование библиотеки jest-fetch-mock
global.fetch = require('jest-fetch-mock');
 
// Настройка мока
fetch.mockResponseOnce(JSON.stringify({ data: 'mock data' }));
 
// Тестируемая функция
async function getData() {
  const response = await fetch('/api/data');
  return response.json();
}
 
// Тест
test('getData должна вернуть данные', async () => {
  const data = await getData();
  expect(data).toEqual({ data: 'mock data' });
  expect(fetch).toHaveBeenCalledWith('/api/data');
});