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 标题的自动翻转实现代码
Oct 14 Javascript
关于javascript中this关键字(翻译+自我理解)
Oct 20 Javascript
js判断设备是否为PC并调整图片大小
Feb 12 Javascript
JavaScript判断文件上传类型的方法
Sep 02 Javascript
jQuery中odd选择器的定义和用法
Dec 23 Javascript
代码分析jQuery四种静态方法使用
Jul 23 Javascript
jquery 删除节点 添加节点 找兄弟节点的简单实现
Dec 07 Javascript
JS中with的替代方法与String中的正则方法详解
Dec 23 Javascript
div实现自适应高度的textarea实现angular双向绑定
Jan 08 Javascript
js仿拉勾网首页穿墙广告效果
Mar 08 Javascript
用angular实现多选按钮的全选与反选实例代码
May 23 Javascript
JavaScript之Map和Set_动力节点Java学院整理
Jun 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
?生?D片??C字串
2006/12/06 PHP
C/S和B/S两种架构区别与优缺点分析
2014/10/23 PHP
PHP+Ajax实时自动检测是否联网的方法
2015/07/01 PHP
PHP的压缩函数实现:gzencode、gzdeflate和gzcompress的区别
2016/01/27 PHP
php rsa 加密,解密,签名,验签详解
2016/12/06 PHP
PHP设计模式之适配器模式(Adapter)原理与用法详解
2019/12/12 PHP
Iframe自适应高度绝对好使的代码 兼容IE,遨游,火狐
2011/01/27 Javascript
document.documentElement和document.body区别介绍
2013/09/16 Javascript
javascript学习笔记(八)正则表达式
2014/10/08 Javascript
javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码
2015/08/04 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
2015/10/09 Javascript
Nodejs进阶:核心模块net入门学习与实例讲解
2016/11/21 NodeJs
基于daterangepicker日历插件使用参数注意的问题
2017/08/10 Javascript
NodeJs通过async/await处理异步的方法
2017/10/09 NodeJs
JavaScript中var、let、const区别浅析
2018/06/24 Javascript
利用百度echarts实现图表功能简单入门示例【附源码下载】
2019/06/10 Javascript
Moment.js实现多个同时倒计时
2019/08/26 Javascript
python实现ftp客户端示例分享
2014/02/17 Python
Python利用turtle库绘制彩虹代码示例
2017/12/20 Python
Python输出\u编码将其转换成中文的实例
2018/12/15 Python
windows10下安装TensorFlow Object Detection API的步骤
2019/06/13 Python
使用Rasterio读取栅格数据的实例讲解
2019/11/26 Python
python多项式拟合之np.polyfit 和 np.polyld详解
2020/02/18 Python
python 双循环遍历list 变量判断代码
2020/05/04 Python
来自圣地亚哥的实惠太阳镜:Knockaround
2018/08/27 全球购物
全球独特生活方式产品和礼品购物网站:AHAlife
2018/09/18 全球购物
.TTL是什么?有什么用处,通常那些工具会用到它?(ping? traceroute? ifconfig? netstat?)
2016/05/09 面试题
如何掌握自荐信格式呢
2013/11/19 职场文书
跑操口号
2014/06/12 职场文书
男性健康日的活动方案
2014/08/18 职场文书
结对共建协议书
2014/08/20 职场文书
合伙经营协议书范本(通用版)
2014/12/03 职场文书
幼儿园音乐教学反思
2016/02/18 职场文书
基于python实现银行管理系统
2021/04/20 Python
Java实现房屋出租系统详解
2021/10/05 Java/Android
mysql函数全面总结
2021/11/11 MySQL