Skip to content

Async/Await

Medium — good to knowFrontend

ELI5 — The Vibe Check

Async/await is syntactic sugar that makes Promises look like normal, readable code. Instead of chaining .then().then().catch(), you write code that looks synchronous but actually waits for async operations. It's the reason modern JavaScript code is readable by humans.

Real Talk

Async/await is a JavaScript syntax (introduced in ES2017) that allows writing asynchronous code in a synchronous style. The async keyword marks a function as asynchronous (it implicitly returns a Promise). The await keyword pauses execution inside the async function until the awaited Promise resolves. Error handling uses standard try/catch.

Show Me The Code

// Without async/await (Promise chains)
function loadUser(id) {
  return fetch(`/api/users/${id}`)
    .then(res => res.json())
    .then(user => user.name)
    .catch(err => 'Unknown')
}

// With async/await (much cleaner)
async function loadUser(id) {
  try {
    const res = await fetch(`/api/users/${id}`)
    const user = await res.json()
    return user.name
  } catch {
    return 'Unknown'
  }
}

When You'll Hear This

Async functions always return a Promise, even if you return a plain value.,Don't await in a loop — use Promise.all for parallel requests.,Forgetting await is a top-tier bug source.

Made with passive-aggressive love by manoga.digital. Powered by Claude.