Language
日本語
English

Caution

JavaScript is disabled in your browser.
This site uses JavaScript for features such as search.
For the best experience, please enable JavaScript before browsing this site.

JavaScript Dictionary

  1. Home
  2. JavaScript Dictionary
  3. async / await

async / await Since: ES2017(ECMAScript 2017)

A syntax for writing asynchronous code in an intuitive, synchronous style. Use async to declare an asynchronous function and await to wait for a Promise to resolve.

Syntax

// Declares an async function. The return value is automatically wrapped in a Promise.
async function functionName() {
	// Waits for the Promise to resolve.
	var result = await Promise;
}

// Using a function expression
var functionName = async function() {
	var result = await Promise;
};

Keywords

KeywordDescription
asyncPlaced before a function to make it an asynchronous function. An async function always returns a Promise.
awaitWaits for a Promise to resolve and extracts the resulting value. Can only be used inside an async function.

Sample Code

// A helper async function for testing
function wait(ms) {
	return new Promise(function(resolve) {
		setTimeout(function() {
			resolve("Waited " + ms + "ms");
		}, ms);
	});
}

// Basic usage of async/await
async function main() {
	console.log("Start");
	var result = await wait(2000); // Waits for 2 seconds.
	console.log(result); // Logs "Waited 2000ms".
	console.log("Done");
}
main();

// Comparison with the then() chain approach
// then() version: nesting tends to grow deeper.
wait(1000).then(function(msg1) {
	console.log(msg1);
	return wait(1000);
}).then(function(msg2) {
	console.log(msg2);
});

// async/await version: code reads top to bottom in a straight line.
async function sequential() {
	var msg1 = await wait(1000);
	console.log(msg1); // Logs "Waited 1000ms".
	var msg2 = await wait(1000);
	console.log(msg2); // Logs "Waited 1000ms" one more second later.
}
sequential();

// Handling errors with try...catch.
async function fetchUserData() {
	try {
		var response = await fetch("https://api.example.com/user");
		var data = await response.json();
		console.log(data.name);
	} catch (error) {
		console.log("Failed to fetch data: " + error.message);
	} finally {
		console.log("Network request finished");
	}
}
fetchUserData();

// Running multiple async operations in parallel
async function loadAll() {
	// Combine Promise.all() with await to wait for all operations to finish.
	var results = await Promise.all([
		fetch("https://api.example.com/users"),
		fetch("https://api.example.com/posts")
	]);
	console.log("All data loaded");
}
loadAll();

Notes on await

await can only be used inside an async function. Using it in a regular function or at the global scope causes an error.

// Incorrect — causes an error
function normal() {
	var result = await wait(1000); // SyntaxError: await cannot be used outside an async function.
}

// Correct — used inside an async function
async function correct() {
	var result = await wait(1000); // Works as expected.
	console.log(result);
}
correct();

Also, writing multiple await calls sequentially runs them one after another. For independent operations, use Promise.all() to run them in parallel for better performance.

// Sequential execution: takes 3 seconds total.
async function slow() {
	var a = await wait(1000); // Waits 1 second.
	var b = await wait(2000); // Waits another 2 seconds.
	console.log(a, b);
}

// Parallel execution: completes in 2 seconds (the slowest task).
async function fast() {
	var results = await Promise.all([wait(1000), wait(2000)]);
	console.log(results[0], results[1]);
}

Overview

async / await is a syntax introduced in ES2017 for working with Promises more concisely. With Promise chains using then(), the more complex the logic, the harder the code becomes to read. With async / await, you can write asynchronous code that looks just like ordinary synchronous code.

An async function always returns a Promise. When you return a value from inside the function, it is automatically wrapped in Promise.resolve(). If an error is thrown, it is wrapped in Promise.reject(), and the caller can handle it with catch() or try...catch.

In modern JavaScript development, most asynchronous code is written with async / await. It is an intuitive syntax for tasks that require waiting — such as server communication, database queries, and file I/O — making it easy even for beginners to understand.

Browser Compatibility

Chrome Chrome
60+
54 or earlier ×
Firefox Firefox
57+
51 or earlier ×
Safari Safari
18+
10 or earlier ×
Edge Edge
80+
14 or earlier ×
IE IE
11 ×
Not supported in any version
Opera Opera
48+
41 or earlier ×
iOS Safari iOS Safari
18+
10 or earlier ×
Android Browser Android Browser
60+
54 or earlier ×
Chrome Android Chrome Android
60+
54 or earlier ×
Firefox Android Firefox Android
79+
51 or earlier ×

If you find any errors or copyright issues, please .