Asynchronous code

synchronous（同步）

同步代码是 按顺序一行一行执行 的。每一行代码都必须等上一行执行完毕之后才能继续。

console.log("A");
console.log("B");
console.log("C");
 
//output:
//A B C

asynchronous（异步）

异步代码允许多个操作 同时进行（并发执行）， 不会阻塞主线程（main thread）的运行。 程序可以在等待一个任务完成的同时，继续做别的事情。

setTimeout(() => console.log("task 1"), 3000);
 
console.log("task 2");
console.log("task 3");
console.log("task 4");
 
//output: task 2 task 3 task 4 task 1

🔧 异步的三种写法

方法	示例	说明
callbacks	setTimeout(()⇒{},1000)	最早期的异步写法
Promise in JS	fetch().then(…).catch(…)	更现代、可链式调用
Async&Await	await fetch()	最清晰、最接近同步思维的异步语法

// ======================== 异步 + 回调函数 示例 ========================
 
// 定义第一个函数 func1，接收一个回调函数 (callback) 作为参数
function func1(callback){
 
  // 使用 setTimeout() 模拟一个耗时任务（例如网络请求、数据加载等）
  // 3秒后执行箭头函数中的内容
  setTimeout(() => {
    console.log("task 1");  // 打印“任务1”表示这个异步操作完成了
 
    // 异步任务完成后，调用传入的回调函数
    // 确保 func2() 在 func1 的任务执行完之后才执行
    callback();
 
  }, 3000); // 延迟时间：3000 毫秒（= 3 秒）
}
 
// 定义第二个函数 func2（普通同步函数）
function func2(){
  console.log("task 2");
  console.log("task 3");
  console.log("task 4");
}
 
// 调用 func1，并把 func2 作为参数（回调函数）传入
func1(func2);