JavaScript 中的异步

Source: Dev.to

🔴 同步（普通）

一个任务完成后才会开始下一个任务。

console.log("One");
console.log("Two");
console.log("Three");

👉 输出

One
Two
Three

🟢 异步

长任务在后台执行，短任务会立即执行。

console.log("Start");

setTimeout(() => {
  console.log("Middle");
}, 2000);

console.log("End");

👉 输出

Start
End
Middle

🔹 为什么需要异步？

• API 调用会耗时
• 文件加载会耗时
• 定时器、用户输入等待

👉 为了避免应用卡死，我们使用异步。

🔹 常见的异步方法

1️⃣ setTimeout()

在延迟之后执行。

setTimeout(() => {
  console.log("Hello");
}, 1000);

2️⃣ setInterval()

重复执行。

setInterval(() => {
  console.log("Hi");
}, 2000);

3️⃣ Promise

表示将来会有结果的承诺。

let promise = new Promise((resolve, reject) => {
  resolve("Success");
});

4️⃣ async / await

简单地处理 Promise。

async function loadData() {
  let result = await fetch(url);
}