ES2017 - Async vs. Yield

Question

I am confused about the current discussion of adding async functions and the keyword await to the next EcmaScript.

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

From my point of view the await keyword to wait for a result of a generator or promise done, a function's return should be enough.

await should simple be usable within normal functions and generator functions with no additional async marker.

And if I need to create a function what should be usable as an result for an await, I simply use a promise.

My reason for asking is this good explanation, where the following example comes from:

async function setupNewUser(name) {     var invitations,       newUser = await createUser(name),       friends = await getFacebookFriends(name);    if (friends) {     invitations = await inviteFacebookFriends(friends);   }    // some more logic } 

It also could be done as normal function, if the execution of a function will wait for finishing the hole function until all awaits are fulfilled.

function setupNewUser(name) {     var invitations,       newUser = await createUser(name),       friends = await getFacebookFriends(name);    if (friends) {     invitations = await inviteFacebookFriends(friends);   }    // return because createUser() and getFacebookFriends() and maybe inviteFacebookFriends() finished their awaited result.  } 

In my opinion the whole function execution is holding until the next tick (await fulfillment) is done. The difference to Generator-Function is that the next() is triggering and changing the object's value and done field. A function instead will simple give back the result when it is done and the trigger is a function internal trigger like a while-loop.

Answer 1

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.