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 相关文章推荐
php图像生成函数之间的区别分析
Dec 06 Javascript
Jjcarousellite 实现图片列表滚动的简单实例
Nov 29 Javascript
Javascript动态创建div的方法
Feb 09 Javascript
TypeScript具有的几个不同特质
Apr 07 Javascript
Javascript aop(面向切面编程)之around(环绕)分析
May 01 Javascript
基于javascript实现图片滑动效果
May 07 Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 Javascript
使用Vue.js创建一个时间跟踪的单页应用
Nov 28 Javascript
Vue2.0+ElementUI实现表格翻页的实例
Oct 23 Javascript
解决vue单页路由跳转后scrollTop的问题
Sep 03 Javascript
VueJS 组件参数名命名与组件属性转化问题
Dec 03 Javascript
vue二选一tab栏切换新做法实现
Jan 19 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
PHP产生不重复随机数的5个方法总结
2014/11/12 PHP
PHP判断网络文件是否存在的方法
2015/03/12 PHP
Yii2实现UploadedFile上传文件示例
2017/02/15 PHP
同一个表单 根据要求递交到不同页面的实现方法小结
2009/08/05 Javascript
jquery easyui的tabs使用时的问题
2010/03/23 Javascript
jQuery 类twitter的文本字数限制带提示效果插件
2010/04/16 Javascript
ASP.NET jQuery 实例3 (在TextBox里面阻止复制、剪切和粘贴事件)
2012/01/13 Javascript
JS返回上一页实例代码通过图片和按钮分别实现
2013/08/16 Javascript
jquery将一个表单序列化为一个对象的方法
2013/12/02 Javascript
简单谈谈json跨域
2016/03/13 Javascript
Markdown与Bootstrap相结合实现图片自适应属性
2016/05/04 Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
2016/05/18 Javascript
BootStrap3学习笔记(一)之网格系统
2016/05/20 Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
2016/08/25 Javascript
详解nodejs 文本操作模块-fs模块(四)
2016/12/22 NodeJs
Vue-cli-webpack搭建斗鱼直播步骤详解
2017/11/17 Javascript
天翼开放平台免费短信验证码接口使用实例
2013/12/18 Python
Python中数字以及算数运算符的相关使用
2015/10/12 Python
Python中dict和set的用法讲解
2019/03/28 Python
python 随机森林算法及其优化详解
2019/07/11 Python
python redis 批量设置过期key过程解析
2019/11/26 Python
pandas factorize实现将字符串特征转化为数字特征
2019/12/19 Python
Python爬虫库BeautifulSoup获取对象(标签)名,属性,内容,注释
2020/01/25 Python
python从PDF中提取数据的示例
2020/10/30 Python
KIKO MILANO俄罗斯官网:意大利领先的化妆品和护肤品品牌
2021/01/09 全球购物
常见的软件开发流程有哪些
2015/11/14 面试题
个人投资计划书
2014/05/01 职场文书
广告宣传策划方案
2014/05/21 职场文书
国际商务英语专业求职信
2014/07/08 职场文书
学生旷课检讨书500字
2014/10/28 职场文书
2014年银行信贷员工作总结
2014/12/08 职场文书
表扬信范文
2015/05/04 职场文书
幼儿园班级工作总结2015
2015/05/25 职场文书
2016年党员学习廉政准则心得体会
2016/01/20 职场文书
python ansible自动化运维工具执行流程
2021/06/24 Python
Python常用配置文件ini、json、yaml读写总结
2021/07/09 Python