介绍
首先从英文介绍开始

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

这里只是js里的解释。

开始
字面上理解下来就是,回调就是一个函数的调用过程。那么就从理解这个调用过程开始吧。函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b。那么这个过程就叫回调。

其实中文也很好理解:回调,回调,就是回头调用的意思。函数a的事先干完,回头再调用函数b。

举个现实的例子:约会结束后你送你女朋友回家,离别时,你肯定会说:“到家了给我发条信息,我很担心你。”对不,然后你女朋友回家以后还真给你发了条信息。小伙子,你有戏了。

其实这就是一个回调的过程。你留了个函数b(要求女朋友给你发条信息)给你女朋友,然后你女朋友回家,回家的动作是函数a。她必须先回到家以后,函数a的内容执行完了,再执行函数b,然后你就收到一条信息了。

这里必须清楚一点:函数b是你以参数形式传给函数a的,那么函数b就叫回调函数。

也许有人有疑问了:一定要以参数形式传过去吗,我不可以直接在函数a里面调用函数b吗?确实可以。求解中。

解惑:如果你直接在函数a里调用的话,那么这个回调函数就被限制死了。但是使用函数做参数就有下面的好处:当你a(b)的时候函数b就成了回调函数,而你还可以a(c)这个时候,函数c就成了回调函数。如果你写成了function a(){...;b();}就失去了变量的灵活性。

上一段代码大家可以跑一下:

function a(callback)
{
alert("我是parent函数a!");
alert("调用回调函数");
callback();
}
function b(){
alert("我是回调函数b");

}
function c(){
alert("我是回调函数c");

}

function test()
{
a(b);
a(c);
}
根据代码示例加深理解
问题:

现在有函数如下定义:
function A(a,callback){
....
}
function B(){
....
}
则可以有如下调用
A(a,B);来实现回调。
现在我希望传给B一个参数c,即实现类似于:  A(a,B(c)); 的效果,应该如何实现?

function A(a,callback){
var b=callback;
alert(a+b);
}
function B(c){
return (-c);
}
A(4,B(3))
根据jquery的ajax请求常见的场景再去写一个示例:

我包装了jQuery的ajax方法:

function doAjax(u,param,callback){
$.ajax({
type:'POST',
url:u,
data:param,
success:callback
});
}

function showAlert(data){
alert(data);
}

比如这样调用 doAjax("url","id=1",showAlert);
$.ajax 在success后,会返回一个data到showAlert中,显示出来 ,没有问题.
可是,当我想多传一个参数给showAlert时怎么写?
写成doAjax("server.php","id=12&type=1",showAlert("hi",data))、或者把上面的success:callback 写成success:callback(msg,data)显然都不行,如之奈何?

其实很简单,很多方法都定义了回调函数,回调函数也是函数,就是说不管怎么传,只需要是个函数类型即可。写法如下:

方式1,
doAjax(参数1,参数2,function(request,opts){
callback(request,opts,agrs);
});
function callback(request,opts,args){

};
方式2,
var args=N;
doAjax(参数1,参数2,function(request,opts){
var X=N;
回调函数代码块..
和以上几乎一样,看个人编码方式选择。
});
再看一个从父函数传递给回调函数的示例

function e(m,n,Callback){
var d = m+n;
alert("一个从父函数e 产生的参数将要被传递给回调函数 ,这个参数是:"+d);

//这里才写你想调用的函数---参数要正确
Callback(d);
}
function callback(data){
alert("我是回调函数,我的名字叫:callback ,我接收到来自父函数的参数,参数是:"+data);
}
e(1,2,callback)
最后
感谢各位的阅读,如有问题麻烦及时指正出来。
---------------------
作者:月亮巡视人间
来源:CSDN
原文:https://blog.csdn.net/undericon/article/details/81188923
版权声明:本文为博主原创文章,转载请附上博文链接!

js的回调函数的更多相关文章

  1. 关于js的回调函数的一点看法

    算了一下又有好几个月没写博客了,最近在忙公司android的项目,所以也就很少抽时间来写些东西了.刚闲下来,我就翻了翻之前看的东西.做了android之后更加感觉到手机端开发的重要性,现在做nativ ...

  2. js的回调函数详解

    本文主要介绍了个人对于javascript中回调函数的理解和使用方法及示例,需要的朋友可以参考下   现在做native App  和Web App是主流,也就是说现在各种基于浏览器的web app框 ...

  3. js的回调函数 一些例子

    这边用bootstrap 3.0的  上传控件做例子 下面是上传控件的一段完整的 js 操作 代码. <!-- 上传缩略图控件配置 --><script> // 定义这四个全局 ...

  4. 没办法,还是要补一下js,回调函数(转载)

    <html> <head> <title>回调函数(callback)</title> <script language="javasc ...

  5. JS 自定义回调函数callback

    1 应用场景:js的异步加载,在get,post,ajax异步加载的时候,可能对应的请求没有完成,这时需要使用请求回来的数据作为参数调用其他函数,这时就需要使用回调函数. 2 回调函数作用:等待函数调 ...

  6. Js 自定义回调函数

    参考 http://mlxnle.iteye.com/blog/1670679 <!doctype html> <html lang="es"> <h ...

  7. Node.js:回调函数

    概要:本篇博客主要通过对比node.js异步与同步方式读取文件的方式来解释node中回调函数的作用. 1.异步方式读取文件: 新建一个文本文档用于测试,如下图: 代码如下: // node异步方式读取 ...

  8. node.js 中回调函数callback(转载),说的很清楚,看一遍就理解了

    最近在看 express,满眼看去,到处是以函数作为参数的回调函数的使用.如果这个概念理解不了,nodejs.express 的代码就会看得一塌糊涂.比如: 复制代码 代码如下: app.use(fu ...

  9. JS中回调函数的写法

    <!DOCTYPE HTML> <html><head>  <meta charset="GBK" /><title>回 ...

随机推荐

  1. 简易轮播图、内含定时器。熟练JS操作

    HTML部分: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF ...

  2. java导出csv格式文件

    导出csv格式文件的本质是导出以逗号为分隔的文本数据 import java.io.BufferedWriter; import java.io.File; import java.io.FileIn ...

  3. 原创《分享(Angular 和 Vue)按需加载的项目实践优化方案》

    针对前端优化的点有很多,例如:图片压缩,雪碧图,js/css/html 文件的压缩合并,  cdn缓存, 减少重定向, 按需加载 等等 最近有心想针对 ionic项目 和 vue项目,做一个比较大的优 ...

  4. vimperator

    racedu http://www.cnblogs.com/rocedu/p/6673380.html 首先这篇答案是用All-in-One Sidebar打开侧栏照打的...以下addons是经过自 ...

  5. docker更改默认仓库地址

    zq@ubuntu:~$ docker pull -h Flag shorthand -h has been deprecated, please use --help Usage: docker p ...

  6. Valse2019笔记——弱监督视觉理解

    程明明(南开大学):面向开放环境的自适应视觉感知 (图片来自valse2019程明明老师ppt) 面向识别与理解的神经网络共性技术 深度神经网络通用架构 -- VggNet(ICLR'15).ResN ...

  7. web 后台返回json格式数据的方式(status 406)

    1.在类上使用注解 @RestController public class HttpComentInterface { } 2.在方法是使用注解  @ResponseBody @RequestMap ...

  8. (5)TCP和UDP协议

    TCP(Transmission Control Protocol)可靠的.面向连接的协议(eg:打电话).传输效率低全双工通信(发送缓存&接收缓存).面向字节流.使用TCP的应用:Web浏览 ...

  9. 键盘坏了几个键位之后,linux上的remap方法

    Use xev command to find the keycode xmodmap -pke |more To Change keymapping for this Laptop: 我是日文键盘, ...

  10. 干货 | 揭秘如何增加listing多个类目节点

    流量是电商销售的必要因素,可以说,任何成功的电商平台都离不开流量.亚马逊listing优化做得好,不仅能提高产品的曝光率,还能提升转换率,而好的类目可以吸引大的流量.帮你快速爬升. 首先我们来了解一下 ...