JS中的回调函数实例浅析


Posted in Javascript onMarch 21, 2018

本文实例讲述了JS中的回调函数。分享给大家供大家参考,具体如下:

在说回调函数之前,不妨先看一段代码,相信有点js基础的同学都能明白他的含义:

document.getElementById('demo').click=function(){
  alert(1);
};

这段代码其实就是一段事件回调,这样写看的其实相对模糊一些,我们不妨看下接下来的代码

document.getElementById('demo').addEventListener('click',function(){
    alert(1)
});

这两段代码的所做的事情其实相同,不同的只是写法的差异,我们看这个addEventListener('eventName',callback)addEventListener这个函数有两个参数,第一个为事件名称,第二个参数实际上就是回掉函数,按照书上来说回调函数的方式,函数中的参数既然可以是变量,那么他也可以是一个函数。可能说到这里大家对回掉函数还是一脸懵逼。我们再看接下来这个例子。

function demo(a,b,callback){
    let c=a+b;
    callback(c);
};
demo(1,2,function(c){
    alert(c);//3
})

这段代码定义了一个demo函数,这个函数有三个参数a,b,callback,我们在这个函数内部声明了一个局部变量c,然后执行我们的callback(回调函数),接下来执行demo这个函数

这个函数的三个参数如上,在回掉函数中弹出的为3。这就是一个简单的回调函数。而要想真正理解回调函数的意义,其实我觉得还是在于明白他的用途,只有明白他的用途了我们才可以真正的去理解他。

回调函数最多的应用场景就是异步操作,因为异步的操作我们不知道这个操作到底何时结束,那么我们后续执行的代码就无法按照应有的流程走下去。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery ready函数滥用分析
Feb 16 Javascript
统计jQuery中各字符串出现次数的工具
May 03 Javascript
js 回车提交表单两种实现方法
Dec 31 Javascript
jQuery文本框(input textare)事件绑定方法教程
Apr 24 Javascript
原生JS实现加入收藏夹的代码
Oct 24 Javascript
基于jquery实现的可编辑下拉框实现代码
Aug 02 Javascript
老生常谈遮罩层 滚动条的问题
Apr 29 Javascript
jquery中用jsonp实现搜索框功能
Oct 18 Javascript
js实现显示手机号码效果
Mar 09 Javascript
VUE使用vuex解决模块间传值问题的方法
Jun 01 Javascript
三步实现ionic3点击退出app程序
Sep 17 Javascript
Vue 简单实现前端权限控制的示例
Dec 25 Vue.js
使用Vue制作图片轮播组件思路详解
Mar 21 #Javascript
JS实现为动态添加的元素增加事件功能示例【基于事件委托】
Mar 21 #Javascript
JS实现遍历不规则多维数组的方法
Mar 21 #Javascript
vue项目关闭eslint校验
Mar 21 #Javascript
去掉vue 中的代码规范检测两种方法(Eslint验证)
Mar 21 #Javascript
使用Vue.js和Flask来构建一个单页的App的示例
Mar 21 #Javascript
JS代码实现电脑配置检测功能
Mar 21 #Javascript
You might like
Zerg建筑一览
2020/03/14 星际争霸
攻克CakePHP系列一 连接MySQL数据库
2008/10/22 PHP
PHP发送AT指令实例代码
2016/05/26 PHP
PHP中FTP相关函数小结
2016/07/15 PHP
php表单处理操作
2017/11/16 PHP
关于jQuery object and DOM element
2013/04/15 Javascript
jquery实现保存已选用户
2014/07/21 Javascript
jquery实现Ctrl+Enter提交表单的方法
2015/07/21 Javascript
jQuery+css3实现Ajax点击后动态删除功能的方法
2015/08/10 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
2016/06/12 Javascript
纯js和css完成贪吃蛇小游戏demo
2016/09/01 Javascript
javascript中活灵活现的Array对象详解
2016/11/30 Javascript
基于Proxy的小程序状态管理实现
2019/06/14 Javascript
JS实现简单打字测试
2020/06/24 Javascript
使用Python的内建模块collections的教程
2015/04/28 Python
Python查询阿里巴巴关键字排名的方法
2015/07/08 Python
Windows环境下python环境安装使用图文教程
2018/03/13 Python
python多进程控制学习小结
2018/10/31 Python
Python UnboundLocalError和NameError错误根源案例解析
2018/10/31 Python
200行python代码实现2048游戏
2019/07/17 Python
Python 3 使用Pillow生成漂亮的分形树图片
2019/12/24 Python
适合Python初学者的一些编程技巧
2020/02/12 Python
Python 实现使用空值进行赋值 None
2020/03/12 Python
Python在线和离线安装第三方库的方法
2020/10/31 Python
HTML5 Canvas绘制圆点虚线实例
2015/01/01 HTML / CSS
澳大利亚领先的女帽及配饰公司:Morgan&Taylor
2019/12/01 全球购物
汽车队司机先进事迹材料
2014/02/01 职场文书
教师先进工作者事迹材料
2014/05/01 职场文书
践行党的群众路线心得体会
2014/11/05 职场文书
2014年销售人员工作总结
2014/11/27 职场文书
罚款通知怎么写
2015/04/22 职场文书
电影小兵张嘎观后感
2015/06/03 职场文书
寻找最美乡村教师观后感
2015/06/18 职场文书
党员公开承诺书2016
2016/03/24 职场文书
MySQL 数据类型选择原则
2021/05/27 MySQL
Java 写一个简单的图书管理系统
2022/04/26 Java/Android