回调函数的理解和使用

一时失言乱红尘 2023-02-12 14:28 20阅读 0赞

什么是回调函数？下面举了两个例子

例：

你到一个商店买东西，刚好你要的东西没有货，于是你在店员那里留下了你的电话，过了几天店里有货了，店员就打了你的电话，然后你接到电话后就到店里去取了货。

在这个例子里，你的电话号码就叫回调函数，你把电话留给店员就叫登记回调函数，店里后来有货了叫做触发了回调关联的事件，店员给你打电话叫做调用回调函数，你到店里去取货叫做响应回调事件。【此段文字来自 知乎 - 常溪玲的回答 -】[什么是回调函数][Link 1]

例：

打个比方，有一家旅馆提供叫醒服务，但是要求旅客自己决定叫醒的方法。可以是打客房电话，也可以是派服务员去敲门，睡得死怕耽误事的，还可以要求往自己头上浇盆水。这里，“**叫醒**”这个行为是旅馆提供的，相当于**库函数**，但是**叫醒的方式**是由旅客决定并告诉旅馆的，也就是**回调函数**。而旅客告诉旅馆怎么**叫醒自己的动作**，也就是把回调函数传入库函数的动作，称为**登记回调函数**（to register a callback function）。【此段文字来自 知乎 - no.body的回答 -】[什么是回调函数？][Link 2]

--------------------

百度百科中定义：

如果你把函数的指针（地址）**作为参数**传递给另一个函数，当这个指针被用来调用其所指向的函数时，我们就说这是回调函数。

回调函数不是由该函数的实现方直接调用，而是在特定的事件或条件发生时由另外的一方调用的，用于对该事件或条件进行响应。

在JavaScript中，回调函数具体的定义为：

函数A作为参数(函数引用)传递到另一个函数B中，并且这个函数B执行函数A。我们就说函数A叫做回调函数。

如果没有名称(函数表达式)，就叫做匿名回调函数。

--------------------

### 回调函数应用场景 ###

*  资源加载：ajax异步请求，动态加载js文件后执行回调，加载iframe后执行回调，图片加载完成执行回调...
 *  链式调用
 *  setTimeout、setInterval的函数调用得到其返回值。【setTimeout、setInterval独立主体调用，用callback将执行结果传递给代理函数处理】

实例：

function fn(callback) {
      setTimeout(function () {
        const data = 'fn'
        callback(data)
      }, 0)
    }
    
    // 如果需要获取一个函数中异步操作的结果，则必须通过回调函数来获取
    fn(function (arg) {
      console.log(arg) // fn
    })

[Link 1]: https://www.zhihu.com/question/19801131/answer/13005983
[Link 2]: https://www.zhihu.com/question/19801131/answer/27459821