Зачем нужны async/await, если есть промисы?

async/await — это не замена промисам, а более читаемый способ их использовать. Под капотом те же промисы, просто синтаксис похож на обычный последовательный код, без лесенки .then.

Сравни. Через .then:

function load() {
  return fetch('/api/user')
    .then(r => r.json())
    .then(user => fetch('/api/posts/' + user.id))
    .then(r => r.json());
}

Через async/await:

async function load() {
  const r1 = await fetch('/api/user');
  const user = await r1.json();
  const r2 = await fetch('/api/posts/' + user.id);
  return await r2.json();
}

Читается сверху вниз как обычный код. await «ждёт» промис и достаёт из него значение. Ошибки ловишь привычным try/catch:

try {
  const data = await load();
} catch (err) {
  console.log(err);
}

Важно: await можно использовать только внутри функции, помеченной async.