JS回调函数基本定义与用法实例分析


Posted in Javascript onMay 24, 2017

本文实例讲述了JS回调函数基本定义与用法。分享给大家供大家参考,具体如下:

初学js的时候,被回调函数搞得很晕,现在回过头来总结一下什么是回调函数。

我们先来看看回调的英文定义:A callback is a function that is passed as an argument to another function and is executed after its parent function has completed。

字面上的理解,回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当那个函数执行完之后,再执行传进去的这个函数。这个过程就叫做回调。

其实也很好理解对吧,回调,回调,就是回头调用的意思。主函数的事先干完,回头再调用传进来的那个函数。但是以前看过很多博客,他们总是将回调函数解释的云里雾里,很高深的样子。

举一个别人举过的例子:约会结束后你送你女朋友回家,离别时,你肯定会说:“到家了给我发条信息,我很担心你。” 对不,然后你女朋友回家以后还真给你发了条信息。小伙子,你有戏了。其实这就是一个回调的过程。你留了个参数函数(要求女朋友给你发条信息)给你女朋友,然后你女朋友回家,回家的动作是主函数。她必须先回到家以后,主函数执行完了,再执行传进去的函数,然后你就收到一条信息了。

现在基本理解回调函数的意思了吧。不理解的话没关系,我们用代码说话。

//定义主函数,回调函数作为参数
function A(callback) {
  callback();
  console.log('我是主函数');
}
//定义回调函数
function B(){
  setTimeout("console.log('我是回调函数')", 3000);//模仿耗时操作
}
//调用主函数,将函数B传进去
A(B);
/*
输出结果
我是主函数
我是回调函数
*/

上面的代码中,我们先定义了主函数和回调函数,然后再去调用主函数,将回调函数传进去。

定义主函数的时候,我们让代码先去执行callback()回调函数,但输出结果却是后输出回调函数的内容。这就说明了主函数不用等待回调函数执行完,可以接着执行自己的代码。所以一般回调函数都用在耗时操作上面。比如ajax请求,比如处理文件等。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Javascript实现CheckBox的全选与取消全选的代码
Jul 20 Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 Javascript
js indexOf()定义和用法
Oct 21 Javascript
js快速排序的实现代码
Dec 08 Javascript
jQuery的animate函数学习记录
Aug 08 Javascript
javascript实现dom元素可拖动
Mar 21 Javascript
[原创]JQuery 在表单提交之前修改 提交的值
Apr 14 Javascript
vue中路由参数传递可能会遇到的坑
Dec 07 Javascript
基于jQuery使用Ajax动态执行模糊查询功能
Jul 05 jQuery
angular 内存溢出的问题解决
Jul 12 Javascript
Vue element-ui父组件控制子组件的表单校验操作
Jul 17 Javascript
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
Dec 29 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 #jQuery
详解前后端分离之VueJS前端
May 24 #Javascript
JQuery Ajax 异步操作之动态添加节点功能
May 24 #jQuery
ES6新特性之类(Class)和继承(Extends)相关概念与用法分析
May 24 #Javascript
使用jQuery.Pin垂直滚动时固定导航
May 24 #jQuery
bootstrap table使用入门基本用法
May 24 #Javascript
Vue动态实现评分效果
May 24 #Javascript
You might like
php自定义函数之递归删除文件及目录
2010/08/08 PHP
PHP常量使用的几个需要注意的地方(谨慎使用PHP中的常量)
2014/09/12 PHP
PHP中JSON的应用技巧
2015/10/10 PHP
Symfony2中被遗弃的getRequest()方法分析
2016/03/17 PHP
thinkPHP统计排行与分页显示功能示例
2016/12/02 PHP
jQuery页面图片伴随滚动条逐渐显示的小例子
2013/03/21 Javascript
js 获取和设置css3 属性值的实现方法
2013/05/06 Javascript
javascript的函数作用域
2014/11/12 Javascript
javascript实现简单的html5视频播放器
2015/05/06 Javascript
js仿支付宝多方框输入支付密码效果
2016/09/27 Javascript
浅谈Node.js ORM框架Sequlize之表间关系
2017/07/24 Javascript
JScript实现地址选择功能
2017/08/15 Javascript
AngularJs 终极购物车(实例讲解)
2017/11/08 Javascript
解决vue项目报错webpackJsonp is not defined问题
2018/03/14 Javascript
vue v-for循环重复数据无法添加问题解决方法【加track-by='索引'】
2019/03/15 Javascript
微信小程序解析富文本过程详解
2019/07/13 Javascript
[57:37]EG vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python正确重载运算符的方法示例详解
2017/08/27 Python
python实现自动发送邮件发送多人、群发、多附件的示例
2018/01/23 Python
Python面向对象程序设计多继承和多态用法示例
2019/04/08 Python
Python 实现交换矩阵的行示例
2019/06/26 Python
python匿名函数用法实例分析
2019/08/03 Python
python-sys.stdout作为默认函数参数的实现
2020/02/21 Python
python 爬虫 实现增量去重和定时爬取实例
2020/02/28 Python
在django admin详情表单显示中添加自定义控件的实现
2020/03/11 Python
CSS3+HTML5+JS 实现一个块的收缩与展开动画效果
2020/11/17 HTML / CSS
自我鉴定的范文
2013/10/03 职场文书
资料员的岗位职责
2013/11/20 职场文书
境外导游求职信
2014/02/27 职场文书
会计学习心得体会
2014/09/09 职场文书
党员个人剖析材料
2014/09/30 职场文书
收款委托书
2014/10/14 职场文书
2014年销售经理工作总结
2014/12/01 职场文书
社区志愿者服务心得体会
2016/01/22 职场文书
教你怎么用PyCharm为同一服务器配置多个python解释器
2021/05/31 Python
HashMap实现保存两个key相同的数据
2021/06/30 Java/Android