В чем разница между промисами и async await

Синтаксис async/await позволяет нам работать с асинхронным кодом так, как будто мы работаем с синхронным.

Рассмотрим простой пример, где некая функция возвращает нам промис с которым мы можем взаимодействовать:

const getUserData = () => {
    return new Promise(resolve => setTimeout(() => resolve("данные"), 1000))
}

Если мы воспользуемся методами класса Promise, то получим результат:

const parentFunction = () = > {
  // ... делаю дела
  // теперь мне нужны данные с удаленного сервера
  getUserData().then(data => {
     // получила данные
     // ... что то делаю с этими данными     
  })
}

где можно увидеть зарождающуюся вложенность, котороя будет только возрастать при усложнении нашей логики и ее зависимости от других асинхронных запросов.

Однако мы может решить этот момент, если воспользуемся async/await:

const parentFunction = async () = > {
  // ... делаю дела
  // теперь мне нужны данные с удаленного сервера
  const data = await getUserData() // получила данные
  // ... что то делаю с этими данными     
}

Данный синтаксис особенно удобен при сложных сценариях, вместе с циклами, конструкциями типа try/catch и т.д.

А так же никакого Promise Hell'a.

Некорректно сравнивать async/await и Promise, так как любая async функция возвращает тот же самый Promise.

Таким образом - они ничем не отличаются.

По сути await просто удобная запись для then.

var res1 = await asyncFun();
var res2 = await res1.nextFun();
console.log(res2);

аналогично

asyncFun()
    .then(res1 => res1.nextFun())
    .then(res2 => console.log(res2));

Поэтому, что именно использовать и в каких случаях может зависеть только от договоренностей внутри команды.

Также стоит упомянуть про работу с циклами.

await позволяет упростить запись, если каждая итерация цикла должна ждать завершение какой-то асинхронной операции, однако, если итерации запускают независимые асинхронные функции - то await ничем не поможет. И для ожидания всех запущенных операций можно воспользоваться Promise.all