Microtasks

Promise handlers .then/.catch/.finally er altid asynkrone.

Selv nr et promise lses umiddelbart, vil koden p linjerne under .then/.catch/.finally stadig kre fr disse handlers.

Her er et eksempel:

let promise = Promise.resolve();

promise.then(() => alert("promise frdig!"));

alert("kode frdig"); // denne kode vises frst

Hvis du krer det, ser du kode frdig frst, og s promise frdig!.

Det er mrkeligt, fordi promise er helt sikkert frdig fra starten.

Hvorfor aktiverede .then efterflgende? Hvad sker der?

Microtasks queue

Asynkrone opgaver har brug for korrekt hndtering. Til det forml specificerer ECMA-standarden en intern k PromiseJobs, som ofte refereres til som microtask queue (V8 term).

Som angivet i specifikationen:

• Ken er first-in-first-out: opgaver, der er sat i ken frst, kres frst.
• Udfrelse af en opgave initieres kun, nr intet andet er i gang.

Eller, sagt p en simpel mde, nr et promise er frdigt, bliver dets .then/catch/finally handlers sat i ken; de bliver ikke udfrt endnu. Nr JavaScript-motoren bliver ledig fra den nuvrende kode, tager den en opgave fra ken og udfrer den.

Det er derfor kode frdig i eksemplet ovenfor vises frst.

[]

Promise handlers gr altid gennem denne interne k.

Hvis der er en kde med flere .then/catch/finally, s udfres hver enkelt asynkront. Det vil sige, at de frst sttes i ken, og derefter udfres, nr den nuvrende kode er frdig og tidligere satte handlers er frdige.

Hvad hvis rkkeflgen er vigtig for os? Hvordan kan vi f kode frdig til at vises efter promise frdig?

Simpelthen ved at putte det i ken med .then:

Promise.resolve()
  .then(() => alert("promise frdig!"))
  .then(() => alert("kode frdig"));

Nu er rkkeflgen som nsket.

Uhndteret afvisning

Husker du unhandledrejection eventen fra artiklen Hndtering af fejl med promises?

Nu kan vi se prcis hvordan JavaScript finder ud af, at der er en uhndteret afvisning.

En uhndteret afvisning opstr, nr en promise fejl ikke hndteres i slutningen af microtask-ken.

Normalt, hvis vi forventer en fejl, tilfjer vi .catch til promise-kden for at hndtere den:

let promise = Promise.reject(new Error("Promise fejlet!"));
promise.catch(err => alert('fanget'));

// krer ikke: fejlen er hndteret
window.addEventListener('unhandledrejection', event => alert(event.reason));

Men hvis vi glemmer at tilfje .catch, s udlser motoren eventet, efter at microtask-ken er tom, og den ser, at der er en promise i afvist tilstand:

let promise = Promise.reject(new Error("Promise fejlet!"));

// Promise fejlet!
window.addEventListener('unhandledrejection', event => alert(event.reason));

Hvad hvis vi hndterer fejlen senere? Sdan her:

let promise = Promise.reject(new Error("Promise fejlet!"));
setTimeout(() => promise.catch(err => alert('fanget')), 1000);

// Error: Promise fejlet!
window.addEventListener('unhandledrejection', event => alert(event.reason));

Hvis vi krer koden vil vi se Promise fejlet! frst og derefter fanget.

Hvis vi ikke kendte til microtasks-ken, kunne vi undre os: Hvorfor krte unhandledrejection handleren? Vi fangede og hndterede fejlen!

Men nu forstr vi, at unhandledrejection genereres, nr microtask-ken er tom: motoren undersger promises, og hvis en af dem er i rejected tilstand, s udlser eventet.

I eksemplet ovenfor kan vi se et .catch blive tilfjet af setTimeout som ogs udlses men det sker senere. P det tidspunkt er unhandledrejection allerede opstet, s det ndrer ikke p noget.

Opsummering

Hndtering af promises er altid asynkron, da alle promise-handlinger gr gennem den interne promise jobs k, ogs kaldet microtask k (V8 term).

S .then/catch/finally handlers kaldes altid efter, at den nuvrende kode er frdig.

Hvis vi har brug for at garantere, at en del af koden bliver udfrt efter .then/catch/finally, kan vi tilfje den til en kdet .then kald.

I de fleste Javascript motorer, inklusiv browsere og Node.js, er konceptet microtasks tt forbundet med event loop og macrotasks. Da disse ikke har en direkte relation til promises, er de behandlet i en anden del af tutorialen, i artiklen Event loop: microtasks and macrotasks.