async / await în JavaScript

async function nume() { const rezultat = await promisiune; }

Ce face async / await

Cuvântul async pus în fața unei funcții o face să returneze mereu o promisiune. În interiorul ei, await oprește funcția până când promisiunea primește rezultatul, fără să blocheze restul paginii.

Erorile se prind cu un try / catch obișnuit. await poate fi folosit doar în funcții async și la nivelul de sus al modulelor JavaScript.

Ce returnează

O funcție async returnează o Promise.

Exemple

Exemplul 1: Pași unul după altul

const pauza = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

async function comanda() {
  console.log("Comandă primită");
  await pauza(200);
  console.log("Plată confirmată");
  await pauza(200);
  console.log("Colet expediat");
}

comanda();

Rezultat

Comandă primită
Plată confirmată
Colet expediat

Exemplul 2: Erori cu try / catch

async function incarcaProfil(id) {
  if (id <= 0) throw new Error("Id invalid");
  return { id, nume: "Ana" };
}

async function main() {
  try {
    console.log(await incarcaProfil(1));
    console.log(await incarcaProfil(-5));
  } catch (eroare) {
    console.log("Eroare: " + eroare.message);
  }
}

main();

Rezultat

{ id: 1, nume: 'Ana' }
Eroare: Id invalid

Exemplul 3: În paralel sau unul după altul

Două await la rând așteaptă pe rând. Cu Promise.all, așteptările se suprapun și totul durează cât cea mai lungă.

const pauza = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

let start = Date.now();
await pauza(300);
await pauza(300);
console.log("Pe rând: aproximativ", Math.round((Date.now() - start) / 100) * 100, "ms");

start = Date.now();
await Promise.all([pauza(300), pauza(300)]);
console.log("În paralel: aproximativ", Math.round((Date.now() - start) / 100) * 100, "ms");

Rezultat

Pe rând: aproximativ 600 ms
În paralel: aproximativ 300 ms

Greșeli frecvente

• Uiți await și primești Promise { <pending> } în loc de rezultat.
• Folosești await într-o funcție fără async. Primești SyntaxError: await is only valid in async functions.
• Pui await într-un forEach. Bucla nu așteaptă. Folosește for...of.

Comenzi înrudite

• Promise / then: O promisiune reprezintă un rezultat care va veni mai târziu: o cerere la server, un fișier citit, o pauză.
• fetch: Trimite o cerere HTTP la un server și primește răspunsul, fără reîncărcarea paginii.
• try / catch: Prinde erorile, ca programul să nu se oprească și să poți afișa un mesaj clar.