DEV Community

Discussion on: 6 points you need to know about async/await in JavaScript

Collapse
nickytonline profile image
Nick Taylor • Edited on

Thanks for the post Yaser!

One thing I'd add is that although we don't have top-level await, it's most likely going to happen as it's at Stage 3.

GitHub logo tc39 / proposal-top-level-await

top-level `await` proposal for ECMAScript (stage 3)

ECMAScript proposal: Top-level await

Champion: Myles Borins

Status: Stage 3

Synopsis

Top-level await enables modules to act as big async functions: With top-level await, ECMAScript Modules (ESM) can await resources, causing other modules who import them to wait before they start evaluating their body.

Motivation

Limitations on IIAFEs

With await only available within async functions, a module can include an await in the code that executes at startup by factoring that code into an async function:

// awaiting.mjs
import { process } from "./some-module.mjs"
let output
async function main() {
  const dynamic = await import(computedModuleSpecifier)
  const data = await fetch(url);
  output = process(dynamic.default, data);
}
main();
export { output };

This pattern can also be immediately invoked. You could call this an Immediately Invoked Async Function Expression (IIAFE), as a play on IIFE idiom.

// awaiting.mjs
import
Collapse
yashints profile image
Yaser Adel Mehraban Author

Thanks for sharing, didn't know about this 👌🏽

Collapse
yashints profile image
Yaser Adel Mehraban Author

Updated the post to reflect this, thanks again Nick