[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/async_function [Back]  [Original]

async function - JavaScript | MDN

MDN Web Docs

View in English Always switch to English

async function

Baseline

20174

async function await async await

async function

function resolveAfter2Seconds() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("resolved");
    }, 2000);
  });
}

async function asyncCall() {
  console.log("calling");
  const result = await resolveAfter2Seconds();
  console.log(result);
  // : "resolved"
}

asyncCall();

js
async function name(param0) {
  statements
}
async function name(param0, param1) {
  statements
}
async function name(param0, param1, /* , */ paramN) {
  statements
}

: async function async function

name

param

statements

await

async function AsyncFunction (Promise)

await await await async await try / catch

: await JavaScript SyntaxError

await JavaScript

: async/await API async/await

js
async function foo() {
  return 1;
}

js
function foo() {
  return Promise.resolve(1);
}

Promise.resolve Promise.resolve

js
const p = new Promise((res, rej) => {
  res(1);
});

async function asyncReturn() {
  return p;
}

function basicReturn() {
  return Promise.resolve(p);
}

console.log(p === basicReturn()); // true
console.log(p === asyncReturn()); // false

0 await await await await

:

js
async function foo() {
  await 1;
}

js
function foo() {
  return Promise.resolve(1).then(() => undefined);
}

await .then

2 foo 3

  1. foo await foo foo
  2. foo await 1 result1 2 await foo
  3. 2 foo 2 2 await 2 result2 return undefined
js
async function foo() {
  const result1 = await new Promise((resolve) =>
    setTimeout(() => resolve("1")),
  );
  const result2 = await new Promise((resolve) =>
    setTimeout(() => resolve("2")),
  );
}
foo();

.catch p1 p2

js
async function foo() {
  const p1 = new Promise((resolve) => setTimeout(() => resolve("1"), 1000));
  const p2 = new Promise((_, reject) =>
    setTimeout(() => reject(new Error("failed")), 500),
  );
  const results = [await p1, await p2]; //  Promise.all  Promise.allSettled 
}
foo().catch(() => {}); // ...

async function function

js
function resolveAfter2Seconds() {
  console.log("starting slow promise");
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("slow");
      console.log("slow promise is done");
    }, 2000);
  });
}

function resolveAfter1Second() {
  console.log("starting fast promise");
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve("fast");
      console.log("fast promise is done");
    }, 1000);
  });
}

async function sequentialStart() {
  console.log("== sequentialStart  ==");

  // 1. 
  const slow = resolveAfter2Seconds();
  console.log(await slow);

  // 2. 
  const fast = resolveAfter1Second();
  console.log(await fast);

  console.log("== sequentialStart  ==");
}

async function sequentialWait() {
  console.log("== sequentialWait  ==");

  // 1. 2 
  const slow = resolveAfter2Seconds();
  const fast = resolveAfter1Second();

  // 2. slow 
  console.log(await slow);
  // 3. fast 
  console.log(await fast);

  console.log("== sequentialWait  ==");
}

async function concurrent1() {
  console.log("== concurrent1  ==");

  // 1. 2 
  const results = await Promise.all([
    resolveAfter2Seconds(),
    resolveAfter1Second(),
  ]);
  // 2. 
  console.log(results[0]);
  console.log(results[1]);

  console.log("== concurrent1  ==");
}

async function concurrent2() {
  console.log("== concurrent2  ==");

  // 2  jobs 
  await Promise.all([
    (async () => console.log(await resolveAfter2Seconds()))(),
    (async () => console.log(await resolveAfter1Second()))(),
  ]);
  console.log("== concurrent2  ==");
}

sequentialStart(); // 2  "slow"  1  "fast" 

// 
setTimeout(sequentialWait, 4000); // 2  "slow"  "fast" 

// 
setTimeout(concurrent1, 7000); // concurrentStart 

// 
setTimeout(concurrent2, 10000); //  1  "fast"  1  "slow" 

await

sequentialStart await 2 2 await 1 2 3

sequentialWait await 3 2 await 2 await 1

Promise.all() Promise.allSettled()

: sequentialWait concurrent1

sequentialWait fast slow catch

concurrent1 Promise.all

Promise API

js
function getProcessedData(url) {
  return downloadData(url) // 
    .catch((e) => downloadFallbackData(url)) // 
    .then((v) => processDataInWorker(v)); // 
}

1

js
async function getProcessedData(url) {
  let v;
  try {
    v = await downloadData(url);
  } catch (e) {
    v = await downloadFallbackData(url);
  }
  return processDataInWorker(v);
}

catch()

js
async function getProcessedData(url) {
  const v = await downloadData(url).catch((e) => downloadFallbackData(url));
  return processDataInWorker(v);
}

2 await return Promise.resolve

ECMAScript 2027 LanguageSpecification
# sec-async-function-definitions


Web Proxy Viewer  |  New URL  |  Original Page