DEV Community

loading...

Discussion on: ⭐️🎀 JavaScript Visualized: Promises & Async/Await

Collapse
yoshcode profile image
Aljosha Novakovic

Wow who would have known that the event loop is really not that complicated at all, just requires a clear explanation, thank you!

I have one question, I was following everything until the last sentence! But maybe I'm just misunderstanding it:

"...The await keyword suspends the async function, whereas the Promise body would've kept on being executed if we would've used then!"

The await keyword suspends anything below it, within it's scope (the async function), until it is resolved. And if you saved that await call in a variable, you can make use of that return value. This code below the await keyword will be on the microtask queue until it is pushed to callstack and executed, like you very clearly explained. But doesn't the Promise "body" also suspend until it is resolved? The callback that you pass into the .then() will only get executed after our promise has been resolved... and similarly to how we can make use of the value we got from await() if we stored it in a variable, we can make use of the resolved value with .then(data => etc...) So don't technically both of them get suspended equally until they receive the resolved value (or rejected value)? Perhaps I'm just interpreting "Promise body" differently...

Thanks!

Collapse
cname87 profile image
cname87

Yes. It's a great article but it should consider the case of awaiting an API call or similar that takes a significant time to return. The simple example using Promise.resolve is not a typical use case. A visualisation of how such api calls would be really useful (although probably time consuming to produce).