ES2017 – Async vs. Yield

by

I do not understand why it is necessary to have the async keyword before the function keyword.

For the same reason that we have the * symbol before generator functions: They mark the function as extraordinary. They are quite similar in that regard – they add a visual marker that the body of this function does not run to completion by itself, but can be interleaved arbitrarily with other code.

  • The * denotes a generator function, which will always return a generator that can be advanced (and stopped) from outside by consuming it similar to an iterator.
  • The async denotes an asynchronous function, which will always return a promise that depends on other promises and whose execution is concurrent to other asynchronous operations (and might be cancelled from outside).

It’s true that the keyword is not strictly necessary and the kind of the function could be determined by whether the respective keywords (yield(*)/await) appear in its body, but that would lead to less maintainable code:

  • less comprehensible, because you need to scan the whole body to determine the kind
  • more errorprone, because it’s easy to break a function by adding/removing those keywords without getting a syntax error

a normal function, whose execution will wait for finishing the hole body until all awaits are fulfilled

That sounds like you want a blocking function, which is a very bad idea in a concurrent setting.

More Related Contents:

  1. Combination of async function + await + setTimeout
  2. Use async await with Array.map
  3. Correct Try…Catch Syntax Using Async/Await
  4. Waiting for more than one concurrent await operation
  5. async/await always returns promise
  6. How can I use async/await at the top level?
  7. Using async/await with a forEach loop
  8. How to “await” for a callback to return?
  9. Async function not returning value, but console.log() does: how to do? [duplicate]
  10. Why do I need to await an async function when it is not supposedly returning a Promise?
  11. Why are await and async valid variable names?
  12. Is there a way to wrap an await/async try/catch block to every function?
  13. How to use ES8 async/await with streams?
  14. Async/Await inside Array#map()
  15. ES8 Immediately invoked async function expression
  16. Property ‘entries’ does not exist on type ‘ObjectConstructor’
  17. async/await inside arrow functions (Array#map/filter)
  18. Is async await truly non-blocking in the browser?
  19. What do square brackets around a property name in an object literal mean?
  20. How can I mock an ES6 module import using Jest?
  21. Spread Syntax vs Rest Parameter in ES2015 / ES6
  22. ES6 exporting/importing in index file
  23. Is there a mechanism to loop x times in ES6 (ECMAScript 6) without mutable variables?
  24. Convert ES6 Iterable to Array
  25. How can I export all functions from a file in JS?
  26. Web Workers – How To Import Modules
  27. Template literals with nested backticks(`) in ES6
  28. React cannot read property map of undefined
  29. What is the technical definition of a Javascript iterable and how do you test for it?
  30. How to understand JS realms

Leave a Comment