JavaScript回调函数callback用法解析


Posted in Javascript onJanuary 14, 2020

这篇文章主要介绍了JavaScript回调函数callback用法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

JavaScript回调函数的使用是很常见的,引用官方回调函数的定义:

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

解释得很明确,回调函数就是作为参数传递给另一个函数并在其父函数完成后执行的函数。

听起来似乎有点不好理解,所以还是举例进行说明,介绍回调函数之前先简单说明一下同步和异步,前端也有同步和异步。同步和异步总得来说,两者最明显的区别就是是否需要等待,如果是串行执行的就是同步机制,是并行执行的就是异步机制,这个比较好理解

回调函数的使用并没有同步和异步的区别,回调函数只是一种特殊的函数,可以应用于同步调用场景,也可以应用于异步调用场景

异步请求中的回调函数

最常用的有ajax异步调用或者事件机制,例子:

$.get('${root}/saveOrUpdate.do',function(result){
      alert(result);
      });

同步请求中的回调函数

业务场景:举个例子,点击按钮会触发main函数,进行接口数据保存(异步方式),数据保存成功之后,再回调打开弹窗的函数

保存数据函数:

function saveRecord(seq,callback){
  $.ajax({
      url:'${root}/saveOrUpdate.do',
      type:"post",
      async:true,
      success:function(result){
        //确保callback是一个函数类型的
        if(typeof(callback)==='function'){
            callback(true);
        }
      }
    }); 
}

main函数

//保存成功,才会打开弹窗
  function main(seq){
    saveRecord(seq,callbackFunction);
  }

回调函数,数据保存成功后再调用

/*保存时的回调函数*/
   function callbackFunction(saveSuccess){
    if(saveSuccess){
      //省略打开弹窗代码
    }
   }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
优化网页之快速的呈现我们的网页
Jun 29 Javascript
jQuery checkbox全选/取消全选实现代码
Nov 14 Javascript
IE浏览器打印的页眉页脚设置解决方法
Dec 08 Javascript
Javascript实现的类似Google的Div拖动效果代码
Aug 09 Javascript
js nextSibling属性和previousSibling属性概述及使用注意
Feb 16 Javascript
浅析JavaScript中的delete运算符
Nov 30 Javascript
JS和jQuery使用submit方法无法提交表单的原因分析及解决办法
May 17 Javascript
KnockoutJS 3.X API 第四章之数据控制流component绑定
Oct 10 Javascript
Angularjs验证用户输入的字符串是否为日期时间
Jun 01 Javascript
详解react-native WebView 返回处理(非回调方法可解决)
Feb 27 Javascript
Node.js net模块功能及事件监听用法分析
Jan 05 Javascript
JavaScript实现多张图片放大镜效果示例【不限定图片尺寸,rem单位】
May 14 Javascript
JS document对象简单用法完整示例
Jan 14 #Javascript
JS document内容及样式操作完整示例
Jan 14 #Javascript
微信小程序indexOf的替换方法(推荐)
Jan 14 #Javascript
小程序中设置缓存过期的实现方法
Jan 14 #Javascript
ES6实现图片切换特效代码
Jan 14 #Javascript
vue项目创建步骤及路由router
Jan 14 #Javascript
JS实现容器模块左右拖动效果
Jan 14 #Javascript
You might like
PHP响应post请求上传文件的方法
2015/12/17 PHP
thinkphp在低版本Nginx 下支持PATHINFO的方法分享
2016/05/27 PHP
表单序列化与jq中的serialize使用示例
2014/02/21 Javascript
深入理解javascript的执行顺序
2014/04/04 Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
2014/10/17 Javascript
JS基于Ajax实现的网页Loading效果代码
2015/10/27 Javascript
jQuery插件AjaxFileUpload实现ajax文件上传
2016/05/05 Javascript
JavaScript学习小结之使用canvas画“哆啦A梦”时钟
2016/07/24 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
js将当前时间格式化为 年-月-日 时:分:秒的实现代码
2018/01/20 Javascript
VUE脚手架具体使用方法
2019/05/20 Javascript
jQuery实现高级检索功能
2019/05/28 jQuery
深入了解JavaScript 私有化
2019/05/30 Javascript
简洁的十分钟Python入门教程
2015/04/03 Python
Python字符串处理之count()方法的使用
2015/05/18 Python
python中__slots__用法实例
2015/06/04 Python
Python语言实现获取主机名根据端口杀死进程
2016/03/31 Python
一些常用的Python爬虫技巧汇总
2016/09/28 Python
解决python3在anaconda下安装caffe失败的问题
2017/06/15 Python
python 列表,数组,矩阵两两转换tolist()的实例
2018/04/04 Python
Python查看微信撤回消息代码
2018/06/07 Python
python3实现二叉树的遍历与递归算法解析(小结)
2019/07/03 Python
Python urllib3软件包的使用说明
2020/11/18 Python
Priority Pass机场贵宾室会籍计划:全球超过1200间机场贵宾室
2018/08/26 全球购物
linux面试题参考答案(8)
2016/04/19 面试题
入党申请自荐书范文
2014/02/11 职场文书
捐款倡议书怎么写
2014/05/13 职场文书
法人代表授权委托书范文
2014/09/10 职场文书
2014年路政工作总结
2014/12/10 职场文书
2015新生加入学生会自荐书
2015/03/24 职场文书
通知函的格式
2015/04/27 职场文书
合同范本之电脑出租
2019/08/13 职场文书
pytorch 中autograd.grad()函数的用法说明
2021/05/12 Python
浅谈pytorch中的dropout的概率p
2021/05/27 Python
学习nginx基础知识
2021/09/04 Servers
Windows Server 2019 域控制器安装图文教程
2022/04/28 Servers