Qual é a diferença entre usar Promise e a sintaxe async/await?

Promise representa um objeto que reflete a conclusão ou rejeição de uma operação assíncrona. Gerencia fluxos assíncronos usando callbacks .then() e .catch().

async/await é um açúcar sintático sobre Promise, que torna o código assíncrono mais legível e semelhante ao síncrono. Uma função marcada como async sempre retorna uma Promise. O operador await só pode ser usado dentro de funções async e pausa a execução até que a Promise seja resolvida ou rejeitada, retornando seu resultado ou lançando uma exceção.

Aspeto	Promise	Async/Await
Legibilidade	Requer cadeias .then() e .catch()	Semelhante ao código síncrono, fluxo linear
Tratamento de erros	Usa .catch()	Usa blocos try...catch
Fluxo de execução	Gerido por callbacks	Pausa/reinicia a função
Valor devolvido	Promise	Promise (para funções async) ou resultado de Promise (para await)
Dependência	Mecanismo independente	Baseado em Promise

Exemplo com Promise:

// Exemplo com Promise
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Dados recebidos (Promise)");
    }, 1000);
  });
}

fetchDataPromise()
  .then(data => console.log(data))
  .catch(error => console.error(error));

Exemplo com async/await:

// Exemplo com async/await
function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Dados recebidos (async/await)");
    }, 1000);
  });
}

async function showData() {
  try {
    const data = await fetchDataAsync();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

showData();