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 相关文章推荐
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 Javascript
用jquery仿做发微博功能示例
Apr 18 Javascript
JavaScript获取路径设计源码
May 22 Javascript
Javascript中prototype属性实现给内置对象添加新的方法
May 14 Javascript
js实现select跳转菜单新窗口效果代码分享(超简单)
Aug 21 Javascript
深入剖析JavaScript面向对象编程
Jul 12 Javascript
JavaScript基础之AJAX简单的小demo
Jan 29 Javascript
原生js仿浏览器滚动条效果
Mar 02 Javascript
关于vuex的学习实践笔记
Apr 05 Javascript
JavaScript EventEmitter 背后的秘密 完整版
Mar 29 Javascript
Vue.js 时间转换代码及时间戳转时间字符串
Oct 16 Javascript
微信小程序学习笔记之跳转页面、传递参数获得数据操作图文详解
Mar 28 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桌面中心(二) 数据库写入
2007/03/11 PHP
php使用number_format函数截取小数的方法分析
2016/05/27 PHP
Laravel中encrypt和decrypt的实现方法
2017/09/24 PHP
php post json参数的传递和接收处理方法
2018/05/31 PHP
filemanage功能中用到的lib.js
2007/04/08 Javascript
js 幻灯片的实现
2011/12/06 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
jquery代码实现简单的随机图片瀑布流效果
2015/04/20 Javascript
js实现简单锁屏功能实例
2015/05/27 Javascript
基于OL2实现百度地图ABCD marker的效果
2015/10/01 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
2016/05/15 Javascript
JS控制弹出悬浮窗口(一览画面)的实例代码
2016/05/30 Javascript
使用jQuery加载html页面到指定的div实现方法
2016/07/13 Javascript
AngularJS bootstrap启动详解及实例代码
2016/09/14 Javascript
vue使用axios跨域请求数据问题详解
2017/10/18 Javascript
vue-cli常用设置总结
2018/02/24 Javascript
Bootstrap4如何定制自己的颜色和风格
2018/02/26 Javascript
使用JavaScript生成罗马字符的实例代码
2018/06/08 Javascript
JS实现利用闭包判断Dom元素和滚动条的方向示例
2019/08/26 Javascript
VScode格式化ESlint方法(最全最好用方法)
2019/09/10 Javascript
JavaScript随机数的组合问题案例分析
2020/05/16 Javascript
jQuery 选择器用法实例分析【prev + next】
2020/05/22 jQuery
谈谈JavaScript令人迷惑的==与+
2020/08/31 Javascript
windows下ipython的安装与使用详解
2016/10/20 Python
Python3.5局部变量与全局变量作用域实例分析
2019/04/30 Python
Python内置加密模块用法解析
2019/11/25 Python
python argparse模块通过后台传递参数实例
2020/04/20 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
MATCHESFASHION.COM法国官网:英国奢侈品零售商
2018/01/04 全球购物
美国韩国化妆品和护肤品购物网站:Beautytap
2018/07/29 全球购物
法律专业自荐信
2014/06/03 职场文书
门面房租房协议书
2014/08/20 职场文书
2014医学院领导干部四风对照检查材料思想汇报
2014/09/16 职场文书
停发工资证明范本
2015/06/12 职场文书
动画《新网球王子 U-17 WORLD CUP》希腊队PV公开
2022/04/02 日漫
SQL Server使用PIVOT与unPIVOT实现行列转换
2022/05/25 SQL Server