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 相关文章推荐
漂亮的仿flash菜单,来自蓝色经典
Jun 26 Javascript
鼠标移动到一张图片时变为另一张图片
Dec 05 Javascript
Javascript 面向对象之重载
May 04 Javascript
javascript学习笔记(十八) 获得页面中的元素代码
Jun 20 Javascript
JS实现table表格数据排序功能(可支持动态数据+分页效果)
May 26 Javascript
JavaScript实现图像模糊化的方法实例
Jan 15 Javascript
Node.js操作redis实现添加查询功能
May 25 Javascript
echart简介_动力节点Java学院整理
Aug 11 Javascript
react中fetch之cors跨域请求的实现方法
Mar 14 Javascript
vue使用localStorage保存登录信息 适用于移动端、PC端
May 27 Javascript
vue3修改link标签默认icon无效问题详解
Oct 09 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 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
实现 win2003 下 mysql 数据库每天自动备份
2006/12/06 PHP
PHP实现获取图片颜色值的方法
2014/07/11 PHP
php实现文本数据导入SQL SERVER
2015/05/17 PHP
PHP自毁程序(慎用)
2015/07/09 PHP
CI框架常用经典操作类总结(路由,伪静态,分页,session,验证码等)
2016/11/21 PHP
PHP与以太坊交互详解
2018/08/24 PHP
jquery 将disabled的元素置为enabled的三种方法
2009/07/25 Javascript
浅谈Vue.js
2017/03/02 Javascript
Vuex模块化实现待办事项的状态管理
2017/03/15 Javascript
Vuex中mutations与actions的区别详解
2018/03/01 Javascript
node 使用 async 控制并发的方法
2018/05/07 Javascript
vue-cli 使用vue-bus来全局控制的实例讲解
2018/09/15 Javascript
layer.open组件获取弹出层页面变量、函数的实例
2019/09/25 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
2019/09/27 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
Vue数据双向绑定原理实例解析
2020/05/15 Javascript
基于asyncio 异步协程框架实现收集B站直播弹幕
2016/09/11 Python
python使用arcpy.mapping模块批量出图
2017/03/06 Python
python虚拟环境virtualenv的安装与使用
2017/09/21 Python
Python实现一个Git日志统计分析的小工具
2017/12/14 Python
分析python切片原理和方法
2017/12/19 Python
Python自定义线程类简单示例
2018/03/23 Python
Pythony运维入门之Socket网络编程详解
2019/04/15 Python
pycharm双击无响应(打不开问题解决办法)
2020/01/10 Python
Python GUI编程学习笔记之tkinter控件的介绍及基本使用方法详解
2020/03/30 Python
Python使用pyexecjs代码案例解析
2020/07/13 Python
python 批量将中文名转换为拼音
2021/02/07 Python
初中英语课后反思
2014/04/25 职场文书
社会体育专业大学生职业生涯规划书
2014/09/17 职场文书
延安红色之旅心得体会
2014/10/07 职场文书
国际残疾人日广播稿范文
2014/10/09 职场文书
2014年服装销售工作总结
2014/11/27 职场文书
公务员岗前培训心得体会
2016/01/08 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python
SQL Server中交叉联接的用法详解
2021/04/22 SQL Server
【海涛dota解说】DCG联赛第一周 LGD VS DH
2022/04/01 DOTA