async await

[Rolf B]

Hallo Dani,

async und await sind ein Sprachkonstrukt, das eine Verkleidung der Promises darstellt. Auch „Syntaxzucker“ genannt.

Das heißt:

• Du kannst jede Funktion awaiten, die ein Promise zurückliefert.
• Jede Funktion, die async ist, gibt ein Promise zurück, d.h. Du kannst auf ihrem Ergebnis .then und .catch aufrufen

Da es kein Promise-basierendes Systemkonstrukt gibt, das eine Zeitverzögerung erzeugt, bist Du bei setTimeout auf ein manuelles Promise angewiesen. Dafür bietet sich ein Konstrukt ohne explizites async an:

(Edit: Dedlfix' Hinweise eingearbeitet)

function delay(milliseconds, data) {
  return new Promise((resolve, reject) => setTimeout(resolve, milliseconds, data));
}

delay(1000, "hugo")
.then(h => console.log(h));

// ODER

let h = await delay(1000, "hugo");
console.log(h); 

gibt in beiden Fällen 1s "hugo" aus.

Der zweite Parameter für <code>delay</code> greift als Rest-Parameter (erkennbar am ...) alle Parameter hinter dem Timeout auf und übergibt sie per Spread-Operator (das ...) als einzelne Parameter ab Position 3 an setTimeout. Von setTimeout werden diese Parameter dann Timeout-Handler durchlauferhitzt, d.h. die Parameter 2 bis N von delay landen als Parameter 3 bis (N+1) bei setTimeout und dann als Parameter 1 bis (N-1) im then-Handler.

... - je nach Kontext Rest oder Spread. Confused? Me too 😉

Rolf