async functions and await

async/await is modern JavaScript's cleanest way to write asynchronous code. Built on top of promises, it lets you write async code that reads like normal, top-to-bottom code — no .then chains, no nesting. It's the syntax most modern code uses, and it makes async feel natural. This is a highlight of modern JavaScript.

async and await basics

Two keywords:

• async before a function — marks it as asynchronous (it returns a promise).
• await before a promise — pauses the function until that promise resolves, then gives you the result value directly.

So var result = await wait(...) reads like a normal assignment — but it waits for the async operation and gives you the value. No .then needed. The code reads top-to-bottom, even though it's asynchronous. (Note: await only pauses its own function, not the whole page — the last line still runs immediately.)

async/await vs .then (same thing, cleaner)

Compare the two: async/await expresses the same sequential logic as a .then chain, but reads like ordinary sequential code — await this, then await that. No callbacks, no chaining, no nesting. For sequential async steps, async/await is dramatically clearer, which is why it's the modern default.

await unwraps the promise value

await unwraps a promise, giving you the value it resolved to — so you work with the actual result directly, as if it were synchronous. This is what makes async/await feel natural: the "future value" becomes a normal value you can use immediately on the next line (inside the async function).

Key rules

Two rules: await only works inside an async function (using it elsewhere is an error), and an async function always returns a promise (even if you return a plain value — it's wrapped in a promise). So an async function's result is consumed with await or .then by its caller. These rules are the framework within which async/await operates.

The mistake beginners make

Using await outside an async function (a syntax error) — mark the function async first. Also, forgetting await (so you get the promise instead of the value — var user = getUser() gives a pending promise, not the user; you need await getUser()). And not realizing an async function returns a promise (so its caller must await or .then it). Remember: await inside async, and await your async calls to get their values. Master this and async becomes easy.

Your turn

Your turn

1. Mark a function async and use await to pause until a promise resolves, getting its value directly.
2. See async/await express the same logic as .then chains, but reading like normal top-to-bottom code.
3. Remember the rules: await only works inside async functions, and async functions always return a promise.

Key points

• async/await (built on promises) writes async code that reads like normal top-to-bottom code — no .then chains or nesting.
• 'async' marks a function (it returns a promise); 'await' pauses the function until a promise resolves, giving the value directly.
• await UNWRAPS a promise into its resolved value — so future values become normal values on the next line.
• Rules: await works only inside an async function; an async function always returns a promise (await/.then its result).