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 相关文章推荐
一个js实现的所谓的滑动门
May 23 Javascript
JSON传递bool类型数据的处理方式介绍
Sep 18 Javascript
extjs_02_grid显示本地数据、显示跨域数据
Jun 23 Javascript
JavaScript中具名函数的多种调用方式总结
Nov 08 Javascript
使用js复制链接中的部分文字的方法
Jul 30 Javascript
使用JavaScript脚本判断页面是否在微信中被打开
Mar 06 Javascript
详解Vue中使用Echarts的两种方式
Jul 03 Javascript
JS+canvas画布实现炫酷的旋转星空效果示例
Feb 13 Javascript
Vue开发之watch监听数组、对象、变量操作分析
Apr 25 Javascript
用 js 写一个 js 解释器过程详解
Aug 02 Javascript
微信小程序移动拖拽视图-movable-view实例详解
Aug 17 Javascript
如何使用JavaScript策略模式校验表单
Apr 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生成便于打印的网页
2006/10/09 PHP
深入解析PHP 5.3.x 的strtotime() 时区设定 警告信息修复
2013/08/05 PHP
PHP查看SSL证书信息的方法
2016/09/22 PHP
php实现和c#一致的DES加密解密实例
2017/07/24 PHP
解决在laravel中auth建立时候遇到的问题
2019/10/15 PHP
经典的解除许多网站无法复制文字的绝招
2006/12/31 Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
2011/03/03 Javascript
jQuery内部原理和实现方式浅析
2015/02/03 Javascript
jquery中添加属性和删除属性
2015/06/03 Javascript
函数window.open实现关闭所有的子窗口
2015/08/03 Javascript
JavaScript获取当前运行脚本文件所在目录的方法
2016/02/03 Javascript
分享JS代码实现鼠标放在输入框上输入框和图片同时更换样式
2016/09/01 Javascript
微信小程序 倒计时组件实现代码
2016/10/24 Javascript
基于jQuery实现照片墙自动播放特效
2017/01/12 Javascript
JavaScript寄生组合式继承实例详解
2018/01/06 Javascript
javascript中call,apply,callee,caller用法实例分析
2019/07/24 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
2019/08/23 Javascript
django 按时间范围查询数据库实例代码
2018/02/11 Python
Django项目开发中cookies和session的常用操作分析
2018/07/03 Python
python读取Excel实例详解
2018/08/17 Python
使用python的pandas库读取csv文件保存至mysql数据库
2018/08/20 Python
Python+pyplot绘制带文本标注的柱状图方法
2019/07/08 Python
Tensorflow的常用矩阵生成方式
2020/01/04 Python
PyTorch中的Variable变量详解
2020/01/07 Python
Python实现Word表格转成Excel表格的示例代码
2020/04/16 Python
如何使用python切换hosts文件
2020/04/29 Python
python Tornado框架的使用示例
2020/10/19 Python
纯CSS3实现给头像加个光芒四射且旋转的背景动画效果
2014/05/07 HTML / CSS
h5使用canvas画布实现手势解锁
2019/01/04 HTML / CSS
以下的初始化有什么区别
2013/12/16 面试题
行政主管职责范本
2014/03/07 职场文书
优秀少先队辅导员先进事迹材料
2014/05/18 职场文书
党员个人整改方案及措施
2014/10/25 职场文书
2014年调度员工作总结
2014/11/19 职场文书
教师学习心得体会范文
2016/01/21 职场文书
初二数学教学反思
2016/02/17 职场文书