js的回调函数
介绍
首先从英文介绍开始
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的回调函数的更多相关文章
- 关于js的回调函数的一点看法
算了一下又有好几个月没写博客了,最近在忙公司android的项目,所以也就很少抽时间来写些东西了.刚闲下来,我就翻了翻之前看的东西.做了android之后更加感觉到手机端开发的重要性,现在做nativ ...
- js的回调函数详解
本文主要介绍了个人对于javascript中回调函数的理解和使用方法及示例,需要的朋友可以参考下 现在做native App 和Web App是主流,也就是说现在各种基于浏览器的web app框 ...
- js的回调函数 一些例子
这边用bootstrap 3.0的 上传控件做例子 下面是上传控件的一段完整的 js 操作 代码. <!-- 上传缩略图控件配置 --><script> // 定义这四个全局 ...
- 没办法,还是要补一下js,回调函数(转载)
<html> <head> <title>回调函数(callback)</title> <script language="javasc ...
- JS 自定义回调函数callback
1 应用场景:js的异步加载,在get,post,ajax异步加载的时候,可能对应的请求没有完成,这时需要使用请求回来的数据作为参数调用其他函数,这时就需要使用回调函数. 2 回调函数作用:等待函数调 ...
- Js 自定义回调函数
参考 http://mlxnle.iteye.com/blog/1670679 <!doctype html> <html lang="es"> <h ...
- Node.js:回调函数
概要:本篇博客主要通过对比node.js异步与同步方式读取文件的方式来解释node中回调函数的作用. 1.异步方式读取文件: 新建一个文本文档用于测试,如下图: 代码如下: // node异步方式读取 ...
- node.js 中回调函数callback(转载),说的很清楚,看一遍就理解了
最近在看 express,满眼看去,到处是以函数作为参数的回调函数的使用.如果这个概念理解不了,nodejs.express 的代码就会看得一塌糊涂.比如: 复制代码 代码如下: app.use(fu ...
- JS中回调函数的写法
<!DOCTYPE HTML> <html><head> <meta charset="GBK" /><title>回 ...
随机推荐
- js中的排序方法
一.冒泡排序 var arr=[22,1,33,19,77]; function bubbleSort(arr){ for(var i=0;i<arr.length-1;i++){ for( ...
- MySQL表的操作
一.存储引擎(了解) 前几节我们知道mysql中建立的库===>文件夹,库中的表====>文件 现实生活中我们用来存储数据的文件有不同的类型,每种文件类型对应各自不同的处理机制:比如处理文 ...
- Spark大型电商项目实战-及其改良(4) 单独运行程序发现的问题
之前的运行结果比对发现,有1个函数的作用在2个job里面是相同的,但是对应的计算时间却差太远 于是把4个job分开运行.虽说使用的数据不同,但是生成数据的生成器是相同的,数据排布差距不大,数据量也是相 ...
- django admin使用-后台数据库管理界面
admin是django提供的基于web的管理数据库的工具,它是django.contrib 的一部分,可以在项目的settings.py中的INSTALLED_APPS看到. 一.admin管理工具 ...
- Elasticsearch .net client NEST使用说明 2.x -更新版
Elasticsearch .net client NEST使用说明 目录: Elasticsearch .net client NEST 5.x 使用总结 elasticsearch_.net_cl ...
- flutter插件汇总2
作者:知乎用户链接:https://www.zhihu.com/question/307594373/answer/568969429来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...
- 做数据挖掘,就算发 20 几分的 CNS 子刊,也是垃圾!?--转载
关于数据挖掘发表文章,我们知道很多人是看不上.瞧不起.嗤之以鼻的.大抵是因为这些人平时只发 CNS 主刊,所以才认为通过数据挖掘这种用「别人的数据」或者叫「干实验」来发文章是“「垃圾」,没有什么价值. ...
- 51nod 1405 树的距离之和 树形dp
1405 树的距离之和 基准时间限制:1 秒 空间限制:131072 KB 收藏 关注 给定一棵无根树,假设它有n个节点,节点编号从1到n, 求任意两点之间的距离(最短路径)之和. Input ...
- selenium+Headless Chrome实现不弹出浏览器自动化登录
目前由于phantomjs已经不维护了,而新版的Chrome(59+)推出了Headless模式,对爬虫来说尤其是定时任务的爬虫截屏之类的是一大好事. 不过按照网络上的一些方法来写的话,会报下面的错误 ...
- python常用技巧
1,关于tab键与4个空格: 由于不同平台间,tab键值设置有所区别,据相关介绍,官方在缩进方面推荐使用4个空格.方便起见,可设置tab自动转换为4个空格. 1.1在pycharm中: 通过fi ...