JS 异步/等待

1. 异步/等待

Async/Await 是一种使用 Promise 的更简洁的方式。它不会取代承诺——它在内部使用它们。

规则：

1
2
async function → always returns Promise
await → pauses function until promise resolves

示例 1：基本异步

1
2
3
4
5
6
7
8
9
10
11
12
function getData() {
  return new Promise(resolve => {
    setTimeout(() => resolve("User loaded"), 1000);
  });
}

async function main() {
  const data = await getData();
  console.log(data);
}

main();

示例2：顺序执行

1
2
3
4
5
6
7
8
9
function step1() { return Promise.resolve("Step 1 done"); }
function step2() { return Promise.resolve("Step 2 done"); }

async function run() {
  const a = await step1();
  const b = await step2();
  console.log(a, b);
}
run();

示例 3：错误处理

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function login(user) {
  return new Promise((res, rej) => {
    if (!user) rej("No user");
    else res("Welcome");
  });
}

async function start() {
  try {
    const msg = await login(null);
    console.log(msg);
  } catch (err) {
    console.log("Error:", err);
  }
}
start();

示例 4：并行执行

1
2
3
4
5
6
7
8
9
10
11
12
function getUsers() {
  return new Promise(res => setTimeout(()=>res("Users"),1000));
}
function getProducts() {
  return new Promise(res => setTimeout(()=>res("Products"),1000));
}

async function load() {
  const [u,p] = await Promise.all([getUsers(), getProducts()]);
  console.log(u,p);
}
load();

示例 5：异步返回 Promise

1
2
3
4
5
async function test(){
  return "Hello";
}

test().then(console.log);