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 相关文章推荐
读jQuery之十四 (触发事件核心方法)
Aug 23 Javascript
读取input:file的路径并显示本地图片的方法
Sep 23 Javascript
一个实用的图片切换支持点击切换和自动轮播
Sep 09 Javascript
提升jQuery的性能需要做好七件事
Jan 11 Javascript
JavaScript中获取纯正的undefined的方法
Mar 06 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
Sep 09 Javascript
Jquery表单验证失败后不提交的解决方法
Oct 18 Javascript
10分钟掌握XML、JSON及其解析
Dec 06 Javascript
jQuery表单校验插件validator使用方法详解
Feb 18 jQuery
Node 模块原理与用法详解
May 13 Javascript
jquery实现淡入淡出轮播图效果
Dec 13 jQuery
JS实现纸牌发牌动画
Jan 19 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
BBS(php & mysql)完整版(二)
2006/10/09 PHP
PHP使用json_encode函数时不转义中文的解决方法
2014/11/12 PHP
Windows下wamp php单元测试工具PHPUnit安装及生成日志文件配置方法
2018/05/28 PHP
jquery购物车实时结算特效实现思路
2013/09/23 Javascript
JS控制日期显示的小例子
2013/11/23 Javascript
Javascript Ajax异步读取RSS文档具体实现
2013/12/12 Javascript
JavaScript的Backbone.js框架环境搭建及Hellow world示例
2016/05/07 Javascript
JavaScript代码里的判断小结
2016/08/22 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
基于Vuex无法观察到值变化的解决方法
2018/03/01 Javascript
关于js的三种使用方式(行内js、内部js、外部js)的程序代码
2018/05/05 Javascript
js实现验证码功能
2020/07/24 Javascript
[01:03]PWL开团时刻DAY6——别打我
2020/11/05 DOTA
python类继承用法实例分析
2015/05/27 Python
浅谈Python中用datetime包进行对时间的一些操作
2016/06/23 Python
Python简单实现Base64编码和解码的方法
2017/04/29 Python
python3下使用cv2.imwrite存储带有中文路径图片的方法
2018/05/10 Python
Python正则表达式实现简易计算器功能示例
2019/05/07 Python
Python面向对象之继承和多态用法分析
2019/06/08 Python
使用pyecharts生成Echarts网页的实例
2019/08/12 Python
opencv实现简单人脸识别
2021/02/19 Python
关于numpy数组轴的使用详解
2019/12/05 Python
python爬虫今日热榜数据到txt文件的源码
2021/02/23 Python
CSS3中引入多种自定义字体font-face
2020/06/12 HTML / CSS
John Hardy官方网站:手工设计首饰的奢侈品牌
2017/07/05 全球购物
澳大利亚运动鞋商店:Platypus Shoes
2019/09/27 全球购物
主要的Ajax框架都有什么
2013/11/14 面试题
假日旅行社实习自我鉴定
2013/09/24 职场文书
汽车专业学生自我评价
2014/01/19 职场文书
《兰亭集序》教学反思
2014/02/11 职场文书
党校学习自我鉴定
2014/02/24 职场文书
2014年“四风”问题个人整改措施
2014/09/17 职场文书
开业庆典活动策划方案
2014/09/21 职场文书
工艺技术员岗位职责
2015/02/04 职场文书
Python访问Redis的详细操作
2021/06/26 Python
php解析非标准json、非规范json的方式实例
2022/05/10 PHP