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 相关文章推荐
关于jQuery参考实例2.0 用jQuery选择元素
Apr 07 Javascript
限制textbox或textarea输入字符长度的JS代码
Oct 16 Javascript
JavaScript实现select添加option
Jul 03 Javascript
Bootstrap的图片轮播示例代码
Aug 31 Javascript
jQuery插件Validate实现自定义表单验证
Jan 18 Javascript
javascript鼠标滑过显示二级菜单特效
Nov 18 Javascript
Vue入门之数据绑定(小结)
Jan 08 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
Oct 22 Javascript
微信小程序实现预览图片功能
Oct 22 Javascript
详解js加减乘除精确计算
Mar 19 Javascript
vue h5移动端禁止缩放代码
Oct 28 Javascript
Vue使用自定义指令实现拖拽行为实例分析
Jun 06 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制作新闻系统的思路
2006/10/09 PHP
支付宝接口开发集成支付环境小结
2015/03/17 PHP
PHP面向对象类型约束用法分析
2019/06/12 PHP
js实现两个值相加alert出来精确到指定位
2013/09/25 Javascript
js截取字符串的两种方法及区别详解
2013/11/05 Javascript
jQuery学习笔记之创建DOM元素
2015/01/19 Javascript
Bootstrap table分页问题汇总
2016/05/30 Javascript
AngularJS中如何使用echart插件示例详解
2016/10/26 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
2020/03/09 Javascript
[22:07]DOTA2-DPC中国联赛 正赛 iG vs Magma 选手采访
2021/03/11 DOTA
学习python的几条建议分享
2013/02/10 Python
linux环境下安装pyramid和新建项目的步骤
2013/11/27 Python
python实现类的静态变量用法实例
2015/05/08 Python
asyncio 的 coroutine对象 与 Future对象使用指南
2016/09/11 Python
Python基于回溯法子集树模板解决全排列问题示例
2017/09/07 Python
Python实现的rsa加密算法详解
2018/01/24 Python
python验证码识别教程之利用滴水算法分割图片
2018/06/05 Python
python 列表,数组和矩阵sum的用法及区别介绍
2018/06/28 Python
Python用于学习重要算法的模块pygorithm实例浅析
2018/08/16 Python
Python实现使用request模块下载图片demo示例
2019/05/24 Python
详解python中groupby函数通俗易懂
2020/05/14 Python
html5定位并在百度地图上显示的示例
2014/04/27 HTML / CSS
项目管理计划书
2014/01/09 职场文书
消防安全检查制度
2014/02/04 职场文书
动漫专业高职生职业生涯规划书
2014/02/15 职场文书
音乐学专业求职信
2014/07/22 职场文书
商场消防安全责任书
2014/07/29 职场文书
联谊活动总结
2014/08/28 职场文书
统计学教授推荐信
2014/09/18 职场文书
2014旅游局党组书记党建工作汇报材料
2014/11/02 职场文书
2014年学生会主席工作总结
2014/11/07 职场文书
居安思危观后感
2015/06/11 职场文书
2016暑期社会实践新闻稿
2015/11/25 职场文书
导游词之贵州百里杜鹃
2019/10/29 职场文书
JDBC连接的六步实例代码(与mysql连接)
2021/05/12 MySQL