Junior (0-2 years)JavaScript
What is the difference between promises and async/await in JavaScript?
Quick answer
async/await is syntax built on top of promises that lets you write asynchronous code that reads like synchronous code; under the hood every async function returns a promise.
A promise represents a value that will be available later and is in one of three states: pending, fulfilled or rejected. You consume it with .then() and .catch(). async/await lets you pause an async function with await until a promise settles, and handle errors with ordinary try/catch.
They are equivalent in power, but await makes sequential logic and error handling much easier to read. A common mistake is awaiting independent calls one after another. Use Promise.all to run them in parallel.
// promises
fetch("/api/user").then(r => r.json()).then(showUser).catch(handleError);
// async/await
async function load() {
try {
const res = await fetch("/api/user");
showUser(await res.json());
} catch (err) {
handleError(err);
}
}
// run independent calls in parallel
const [user, posts] = await Promise.all([getUser(), getPosts()]);Key points
- async functions always return a promise
- await only pauses the async function, not the whole thread
- Use Promise.all for independent work
Questions interviewers ask next
- What is the difference between Promise.all, allSettled, race and any?
- What happens if you forget to await a promise?