网站建设和管理精准营销的概念
强烈建议看完本文章后再看一次箭头函数用法
关于Javascript ES6箭头函数用法的分析，函数声明的几个方式-CSDN博客
一、什么是回调函数？
✅ 一、什么是回调函数？
回调函数（Callback Function） 是 被当作参数传入另一个函数，并且在未来某个时间由那个函数调用的函数。
📌 一句话记住：
“不是你主动调用它，而是别的函数帮你调用它。”
✅ 二、你举的例子拆解分析
📍 例子 1：map()
[1, 2, 3].map((item) => item * 2);
-
map()是数组的方法。 -
它接收一个函数作为参数，对数组的每个元素调用这个函数。
-
你传进去的是这个箭头函数
(item) => item * 2 -
所以这个箭头函数就是一个 回调函数。
✅ 解释流程：
const nums = [1, 2, 3];
const doubled = nums.map(function(item) {// 回调函数由 map 自动调用，每个 item 都执行一次return item * 2;
});
console.log(doubled); // [2, 4, 6]
📍 例子 2：setTimeout
setTimeout(() => console.log('ok'), 1000);
-
setTimeout()是定时器函数。 -
它会在 1 秒后“自动调用”你传进去的函数。
-
所以箭头函数是一个 回调函数（它是由系统调用的，不是你手动调用的）。
📍 例子 3：then()
fetch('/api').then(res => res.json());
-
then()是 Promise 的方法。 -
你传给
then()的箭头函数，会在 fetch 请求完成、拿到响应数据后由系统调用。 -
所以这个函数也是一个 回调函数。
✅ 三、回调函数的本质定义（图解）
你写的函数 ——> 被“传进去” ——> 由别人“调用” ——> 就是回调
比如：
function sayHello(callback) {console.log("准备调用你传入的函数");callback(); // 你传的函数在这里被执行！
}sayHello(() => {console.log("你好，我是回调函数！");
});
输出：
准备调用你传入的函数
你好，我是回调函数！
✅ 四、回调函数 VS 普通函数 的区别
| 类型 | 谁调用它？ | 什么时候执行？ |
|---|---|---|
| 普通函数 | 你自己调用 | 你代码中写在哪就执行到哪 |
| 回调函数 | 别人（系统/函数）调用 | 事件发生、延迟完成、请求返回时 |
✅ 五、拓展：回调函数的应用场景
| 场景 | 回调函数作用 |
|---|---|
| 异步操作 | setTimeout(fn)、fetch().then(fn) |
| 数组遍历 | map(fn)、filter(fn) |
| 事件监听 | button.addEventListener('click', fn) |
| 自定义函数参数 | runTask(fn) |
✅ 总结一句话：
回调函数是“你写、别人调”的函数，用于延迟、异步、事件响应等场景中，非常常见，尤其在 JavaScript 中，是核心编程思想之一。
如果你想做一个小项目体验回调函数（比如按钮点击、延迟打印、多步异步操作），我可以带你一步步写。要不要试试看？