Code That Reads Like Synchronous

async/await is syntactic sugar built on top of Promises that makes asynchronous code look and read almost like synchronous code. There's no new underlying mechanism — it's just a cleaner way to work with Promises.

The async Keyword

Place async before a function declaration. The function will always return a Promise, wrapping any returned value automatically.

async function getData() {
  return 42; // Automatically wrapped in Promise.resolve(42)
}
getData().then(value => console.log(value)); // logs: 42

The await Keyword

Works only inside an async function. It pauses execution of the function until the Promise settles and returns its value.

async function loadUserProfile(userId) {
  // Instead of chaining .then(), we just "await" the result
  const response = await fetch('/users/' + userId);
  const user = await response.json();
  const posts = await fetch('/posts?userId=' + user.id);
  const postsData = await posts.json();
  
  return { user, posts: postsData };
}

Error Handling with try/catch

async function loadData() {
  try {
    const response = await fetch('/api/data');
    const data = await response.json();
    return data;
  } catch (err) {
    console.error('Failed to load:', err);
    return null; // Return a safe default
  }
}