关于Javascript回调函数的一个妙用


Posted in Javascript onAugust 29, 2016

前言

其实回调函数简单通俗点就是当有a和b两个函数,当a作为参数传给b,并在b中执行,这时a就是一个回调(callback)函数,如果a是一个匿名函数,则为匿名回调函数那下面们来通过一个实例来具体解释下Javascript回调函数怎么使用。

实例

在很久很久以前,有一个人。

var person;

他是个人,也就是一个对象。

person= {}; // 在JavaScript中,花括号就代表是一个对象

他有个名字叫小明。

person.name = '小明';

看一下是不是真的叫小明。

alert(person.name);

嗯,有一天,小明捡到了10块钱。

person.money = '10块钱';

有了钱就要花,于是他打算把10块钱用掉。

小明有一个花钱的方法 spendMoney ()

person.spendMoney =function(){  alert(this.name +"用 "+this.money +" 块钱买了漫画书!");  }

运行:

person.spendMoney();

弹出提示:小明用10块钱买了漫画书。

好了,问题来了,小明花钱就非得买漫画书吗,肯定不是。

事实情况应该是,这钱怎么办,还是由他自己说了算。因为钱在小明的口袋里。

所以,就可以用回调函数了。

回调函数本身就是一个数据类型。

在javaScript中,函数的地位和java中的Stringintboolean等等都是一样的,都可以看成是一个数据类型。

既然是数据类型,当然可以当成参数传递。

于是就应该这样:

person.spendMoney =function(doSomeThing){  doSomeThing();  }

打了个括号就是执行函数的意思。

没打括号的函数,就是和Stringint一样的玩意儿。

是一个数据类型。

一样的。

JAVA里面会这么写:

String str ="HelloWorld!";

在JavaScript中,函数也是一样的。

var say =function(){ 

   alert('HelloWorld');

}

这时候的say就是一个数据类型。

因为没有打括号,打了括号他才会执行!

小明用十块钱做什么,他自己说了算。

person.spendMoney(function(){});

这样就是把函数传进去了。

把函数传入spendMoney方法的目的就是让函数在里面执行的。

所以:

person.spendMoney =function(doSomeThing){  doSomeThing(); }

里面就打了括号,代表要执行这个函数。

具体做什么,自己决定。

person.spendMoney(function(){  alert('还是把钱存起来吧!'); });

总结

就是可以将函数作为一个参数,传入一个方法内,并且能够在该方法中执行这个函数,这也就是js特有的回调函数的魔力。

以上就是关于Javascript回调函数用法的全部内容,希望对大家的学习和工作能有所帮助。如果有疑问可以留言讨论。

Javascript 相关文章推荐
js url传值中文乱码之解决之道
Nov 20 Javascript
用JS写的一个TableView控件代码
Jan 23 Javascript
jQuery操作select下拉框的text值和value值的方法
May 31 Javascript
js+html5实现canvas绘制镂空字体文本的方法
Jun 05 Javascript
javascript创建对象、对象继承的实用方式详解
Mar 08 Javascript
AngularJS教程之MVC体系结构详解
Aug 16 Javascript
html、css和jquery相结合实现简单的进度条效果实例代码
Oct 24 Javascript
js从输入框读取内容,比较两个数字的大小方法
Mar 13 Javascript
ES6新特性之解构、参数、模块和记号用法示例
Apr 01 Javascript
ionic2自定义cordova插件开发以及使用(Android)
Jun 19 Javascript
Vue中的作用域CSS和CSS模块的区别
Oct 09 Javascript
八种Vue组件间通讯方式合集(推荐)
Aug 18 Javascript
Javascript学习之谈谈JS的全局变量跟局部变量(推荐)
Aug 28 #Javascript
利用jQuery的动画函数animate实现豌豆发射效果
Aug 28 #Javascript
教你如何在Node.js中使用jQuery
Aug 28 #Javascript
分享JavaScript监听全部Ajax请求事件的方法
Aug 28 #Javascript
Node.js 日志处理模块log4js
Aug 28 #Javascript
node.js中 stream使用教程
Aug 28 #Javascript
ionic组件ion-tabs选项卡切换效果实例
Aug 27 #Javascript
You might like
php基础知识:类与对象(5) static
2006/12/13 PHP
深入php 正则表达式的学习探讨
2013/06/06 PHP
Yii2框架BootStrap样式的深入理解
2016/11/07 PHP
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
2011/12/20 Javascript
js点击更换背景颜色或图片的实例代码
2013/06/25 Javascript
写出高效jquery代码的19条指南
2014/03/19 Javascript
ie9 提示'console' 未定义问题的解决方法
2014/03/20 Javascript
调试JavaScript中正则表达式中遇到的问题
2015/01/27 Javascript
IE9+已经不对document.createElement向下兼容的解决方法
2015/09/14 Javascript
js实现选中页面文字将其分享到新浪微博
2015/11/05 Javascript
JS实现的DIV块来回滚动效果示例
2017/02/07 Javascript
支持移动端原生js轮播图
2017/02/16 Javascript
js实现移动端微信页面禁止字体放大
2017/02/16 Javascript
AngularJS的ng-click传参的方法
2017/06/19 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
vue+elementUI实现表格关键字筛选高亮
2020/10/26 Javascript
JavaScript实现动态生成表格
2020/08/02 Javascript
vue组件中传值EventBus的使用及注意事项说明
2020/11/16 Javascript
[58:59]完美世界DOTA2联赛PWL S3 access vs CPG 第一场 12.13
2020/12/16 DOTA
python中assert用法实例分析
2015/04/30 Python
Python sys.argv用法实例
2015/05/28 Python
在Python的Django框架的视图中使用Session的方法
2015/07/23 Python
python实现将字符串中的数字提取出来然后求和
2020/04/02 Python
判断Threading.start新线程是否执行完毕的实例
2020/05/02 Python
pycharm中使用request和Pytest进行接口测试的方法
2020/07/31 Python
怎样在程序里获得一个空指针
2015/01/24 面试题
SQL里面IN比较快还是EXISTS比较快
2012/07/19 面试题
Linux Interview Questions For software testers
2013/05/17 面试题
个人简历中的自我评价范例
2013/10/29 职场文书
中秋节超市促销方案
2014/01/30 职场文书
三好学生先进事迹材料
2014/08/28 职场文书
校园主题婚礼活动策划方案
2014/09/15 职场文书
机动车登记业务委托书
2014/10/08 职场文书
2015年清明节扫墓演讲稿
2015/03/18 职场文书
德劲DE1108畅想
2021/04/22 无线电
Python用any()函数检查字符串中的字母以及如何使用all()函数
2022/04/14 Python