В чем разница между ключевыми словами async и await?

Разница между async и await заключается в их назначении при работе с асинхронными операциями в JavaScript:

• async — это модификатор функции, который указывает на то, что функция является асинхронной. Асинхронная функция всегда возвращает Promise, даже если явно не возвращает его или возвращает не-Promise значение. Это значение будет обёрнуто в разрешенный Promise.
• await — это оператор, который может использоваться только внутри async функции. Он приостанавливает выполнение async функции до тех пор, пока Promise, к которому он применяется, не будет разрешен или отклонен. После разрешения Promise, оператор await возвращает его разрешенное значение. Если Promise отклонен, await выбрасывает ошибку.

Проще говоря, async определяет, что функция может использовать await, а await позволяет "дождаться" результата асинхронной операции внутри такой функции, делая асинхронный код выглядящим и ведущим себя как синхронный.

// Пример использования
async function fetchData() {
  // await используется внутри async функции
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  console.log(data);
}

// Вызов async функции
fetchData();

Без async и await пришлось бы использовать .then() для обработки промисов:

// Эквивалент без async/await
function fetchDataWithThen() {
  fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => console.log(data));
}

fetchDataWithThen();

Сравнение: