JavaScript 回调函数基础

回调函数（Callback Function）是编程里非常基础的核心思想，本质一句话就能讲清：

把一个函数作为参数交给另一个函数，由接收方决定何时调用它。它既可能在当前流程中同步执行，也可能在事件触发或异步操作完成后执行。

你可以把它理解成「留联系方式，等事情办完了通知我」：你去政务大厅办业务（调用主函数），留下手机号（传入回调函数），不用一直在大厅死等；等业务办理完成（条件触发），工作人员给你打电话通知你取件（执行回调函数里的逻辑）。

一、两个核心分类

回调分两种，最常用的是异步回调，但也有同步回调。

同步回调：立刻执行，主流程等它走完

主函数执行过程中，当场就调用回调函数，回调执行完才会继续往下走。最典型的就是数组遍历方法：

// 这是回调函数：定义好“每个元素要做什么”
function printItem(item) {
  console.log("遍历到元素：", item);
}

// 主函数 forEach 接收回调，遍历到每个元素时就调用一次回调
[1, 2, 3].forEach(printItem);

特点：同步阻塞，回调没执行完，后面的代码不会运行。

异步回调：等时机到了才执行（最常用）

主函数先走完，不会等回调；等某个事件触发（定时器到点、接口返回、文件读取完成），才去执行回调。这是前端、Node.js 里最常见的场景：

// 回调函数：3秒后要做的事
function after3s() {
  console.log("3秒到了，执行回调");
}

// 主函数 setTimeout 接收回调，时间到了才调用它
setTimeout(after3s, 3000);

console.log("我先执行，不用等3秒");

运行结果是先打印「我先执行」，3 秒后才打印「执行回调」—— 主程序不会卡住等待，这就是回调解决异步问题的核心价值。

再举一个后端更熟悉的 Node.js 读文件例子：

const fs = require("fs");

// 回调：文件读取完成后才执行
function readFinish(err, data) {
  if (err) return console.log("读取失败");
  console.log("文件内容：", data.toString());
}

// 异步读文件，读完自动调用回调
fs.readFile("./config.txt", readFinish);

console.log("程序继续跑，不等文件读完");

二、为什么要用回调？它解决了什么问题

灵活定制，解耦代码同一个主函数，传不同的回调就能实现完全不同的功能。比如 forEach 只负责 “遍历”，你传打印逻辑就输出、传求和逻辑就累加，核心遍历逻辑不用改。
处理异步，不阻塞主线程。JavaScript 代码通常在主线程执行，浏览器或 Node.js 运行时负责协调定时器、网络和文件 I/O；操作完成后，再通过事件循环安排回调执行。
事件驱动编程前端的点击事件、键盘事件，本质都是回调：你给按钮绑定一个点击回调函数，用户不点就不执行，点了才触发。

三、回调的经典痛点：回调地狱

当多个异步操作有依赖关系（比如先读 A 文件，再根据 A 读 B 文件，再根据 B 发请求），就会出现层层嵌套的「回调地狱」：

fs.readFile("a.txt", (err, data1) => {
  fs.readFile("b.txt", (err, data2) => {
    fs.readFile("c.txt", (err, data3) => {
      // 嵌套越多，代码越难读、越难维护
    });
  });
});

代码横向发展，可读性、可维护性极差。

演进解决方案

为了改善回调地狱，JavaScript 逐步引入了 Promise 和 async/await。async/await 建立在 Promise 之上，能用更接近同步流程的形式组织异步代码，但事件完成后仍需要由运行时调度后续任务。

四、一句话总结

回调不是某门语言的专属语法，而是一种通用编程思想：先把 “后续要做的逻辑” 打包成函数，交给别人；等条件成熟了，别人再帮你执行这段逻辑。从前端事件、接口请求，到后端文件 IO、数据库操作，几乎所有开发场景都会用到它。

JavaScript 回调函数基础