Кратко
async function всегда возвращает Promise. await приостанавливает выполнение ЭТОЙ async-функции до завершения Promise. await НЕ блокирует весь JavaScript — он блокирует только текущую async-функцию. try/catch с await ловит ошибки reject.
Подробно
async/await — синтаксический сахар над Promises:
async function getUser() { const response = await fetch('/api/user'); const user = await response.json(); return user; }
Это эквивалентно: function getUser() { return fetch('/api/user') .then(response => response.json()); }
Что делает async:
- Возвращает Promise
- Позволяет использовать await внутри
Что делает await:
- Приостанавливает выполнение ЭТОЙ функции
- Ждёт settlement Promise
- Возвращает результат (resolve) или выбрасывает ошибку (reject)
- НЕ блокирует весь поток!
try/catch с await:
async function loadData() {
try {
const response = await fetch('/api/data');
if (!response.ok) {
throw new Error(HTTP ${response.status});
}
const data = await response.json();
console.log(data);
} catch (error) {
console.log(Ошибка: ${error.message});
} finally {
console.log('Завершено');
}
}
Параллельные операции: // Последовательно (медленно): const users = await fetchUsers(); const posts = await fetchPosts(); // ждём users!
// Параллельно (быстро): const [users, posts] = await Promise.all([ fetchUsers(), fetchPosts() ]);
Ментальная модель
await — как очередь в магазине. Вы встаёте в очередь (await), но это НЕ значит, что весь мир замер. Другие люди (другой код) продолжают работать. Вы просто ждёте свою очередь. Когда кассир готов (Promise resolved) — вы получаете результат.
Примеры
**Самый простой:**
async function greet() {
return 'Привет!'; // автоматически оборачивается в Promise
}
greet().then(msg => console.log(msg)); // 'Привет!'async функция всегда возвращает Promise.
**Простой:**
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function main() {
console.log('Начало');
await delay(1000); // ждём 1 секунду
console.log('Через секунду');
await delay(1000);
console.log('Ещё секунду');
}
main();
// Вывод: Начало → (1сек) Через секунду → (1сек) Ещё секундуawait приостанавливает только текущую async-функцию.
**Реальный пример:**
async function fetchUserData(userId) {
try {
const response = await fetch(`/api/users/${userId}`);
if (!response.ok) {
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
}
const user = await response.json();
console.log(`Имя: ${user.name}`);
return user;
} catch (error) {
if (error.name === 'TypeError') {
console.log('Проблема с сетью');
} else {
console.log(`Ошибка: ${error.message}`);
}
throw error; // пробрасываем дальше
}
}
// Вызываем внутри другой async-функции:
async function init() {
await fetchUserData(1);
}
init();
// Top-level await (await вне функции) работает только в ES-модулях
// или в консоли DevTools — в обычном скрипте так писать нельзя.try/catch с await для обработки ошибок сети и HTTP.
Частые ошибки
**Неправильно:** Думать, что await блокирует весь браузер
**Почему:** await блокирует ТОЛЬКО текущую async-функцию. Другой код продолжает выполняться.
**Правильно:** await = пауза в async-функции, не во всём приложении.
**Неправильно:** Забывать await перед fetch
**Почему:** fetch возвращает Promise, а не Response. Без await response — это Promise, не объект.
**Правильно:** const response = await fetch(...);
**Неправильно:** Использовать await вне async-функции
**Почему:** await работает только внутри async-функций (или в top-level в модулях).
**Правильно:** Оберните в async функцию или используйте .then().
**Неправильно:** Забывать проверять response.ok
**Почему:** fetch НЕ reject на HTTP 404/500! Он resolve с response.ok = false.
**Правильно:** Всегда проверяйте response.ok или response.status.
Важно запомнить
- async функция всегда возвращает Promise
- await приостанавливает только свою async-функцию
- await НЕ блокирует весь JavaScript
- try/catch для обработки ошибок с await
- fetch resolve даже на HTTP 404/500 — проверяйте response.ok
Связь
Назад: Вы понимаете промисы (JA4) — async/await делает их чтение проще.
Вперёд: Следующий урок (JA6) — комбинаторы промисов для параллельного выполнения.