JS 对于回调函数的理解,和常见的使用场景应用,使用注意点
-
很经常我们会遇到这样一种情况:
例如,你需要和其他人合作,别人提供数据,而你不需要关注别人获取或者构建数据的方式方法。
你只要对这个拿到的数据进行操作。
这样,就相当于我们提供一个外在的函数,别人调用这个函数,返回相应的数据。
例如:
12345678function (num , numFun) {
if
(num <
10
){
//do sth
}
else
{
//do sth
numFun();
}
}
在num的判断之后执行NumFun的函数。
所谓的回调函数,可以这样理解,它是为了实现这样一个目的:
draw方法是一个绘图的函数
现在我们调用这个draw方法,希望在图形绘制完成之后,我们能够进行相应的操作,为了保证这个操作是在绘图完成之后调用的。
我们就采取这样一种方法,将fun作为参数传递进draw,然后再draw函数执行完成之后,调用这个传递的fun方法
1234567891011121314151617function draw(beforeDraw, afterDraw) {
beforeDraw();
//绘图
//dosth
afterDraw();
}
//别人调用
draw(function(){
alert(
'绘图之前执行'
);
//绘图之前,do sth
},
function(){
alert(
'绘图之后执行'
);
//绘图之后,do sth
})
当然利用这种思想,我们可以在很多地方有很巧妙的使用:
比如之前举得例子
你只关注数据的返回值,不关注别人调用这个方法是怎么操作的。
方法1:
就可以利用回调函数的思想,定义方法传入的参数为函数,别人调用是,在函数参数中执行相应的操作,然后返回你所需要的值:
12345678var drawBase = {
init : function (getdata){
var mydata = getdata();
$(
'#testID'
).bind(
'click'
, function(e){
//利用mydata进行绘图操作
})
},
}
//别人在调用你这个函数时候,传入的参数为函数,函数中进行操作后返回相应的值
12345drawBase.init(function () {
//do sth
一系列操作之后
return
data;
})
方法2、
你也可以,先定义一个空方法,然后别人再去重写这个方法,进行一系列的操作之后,返回相应的数据
然后我们使用时候,就可以拿到这个返回的数据了:
Exp:
123456789var drawBase = {
getdata = { },
init : function () {
$(
'testID'
).bind(
'click'
, function () {
var data = drawBase.getdata();
//使用data进行你所需要的操作
})
}
}
//别人调用时候,就需要重写这个方法
1234drawBase.getData = function () {
//一系列操作,得到data,
return
data;
}
这两种方法可以这样理解:
方法一,绑定事件和操作,是在别人调用时候才做的,因此那个时候getdata()的方法是已知的可以直接绑定
方法二,绑定的事件和操作,是之前进行的,此时不知道getdata()的方法,因而给定一个空的方法定义,在别人调用重写后,就可以拿到相应的数据
这个是我个人的一些看法~
Exp:
12345678var stu={
init : function(callback){
//TODO ...
if
(callback && (callback
instanceof
Function){
callback(
'init...'
);
//回调
}
}
};
别人调用,传入函数参数:
123stu.init(function(){
//这就是回调了...
});
加油!
JS 对于回调函数的理解,和常见的使用场景应用,使用注意点的更多相关文章
- js中的回调函数的理解和使用方法
js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...
- js回调函数(callback)理解
Mark! js学习 不喜欢js,但是喜欢jquery,不解释. 自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速google之,发现原来中文翻译成回调.也就是回调函 ...
- js回调函数的理解
js回调函数(callback)理解 Mark! 讲之前说一句 function say(){ alert(,,,,,,,,) } var say=function (){ alert(,,,,,,, ...
- 关于js的回调函数的一点看法
算了一下又有好几个月没写博客了,最近在忙公司android的项目,所以也就很少抽时间来写些东西了.刚闲下来,我就翻了翻之前看的东西.做了android之后更加感觉到手机端开发的重要性,现在做nativ ...
- js的回调函数详解
本文主要介绍了个人对于javascript中回调函数的理解和使用方法及示例,需要的朋友可以参考下 现在做native App 和Web App是主流,也就是说现在各种基于浏览器的web app框 ...
- JavaScript callback function 回调函数的理解
来源于:http://mao.li/javascript/javascript-callback-function/ 看到segmentfault上的这个问题 JavaScript 回调函数怎么理解, ...
- 回调函数透彻理解Java
http://blog.csdn.net/allen_zhao_2012/article/details/8056665 回调函数透彻理解Java 标签: classjavastringinterfa ...
- JS高阶函数的理解(函数作为参数传递)
JS高阶函数的理解 高阶函数是指至少满足下列条件之一的函数. · 函数可以作为参数被传递 · 函数可以作为返回值输出 一个例子,我们想在页面中创建100个div节点,这是一种写法.我们发现并不是所有用 ...
- js中的回调函数的理解
一,常见的但是不是特别注意的回调方法. 1.1,ajax $.ajax({ url:"test.json", type: "GET", data: {usern ...
随机推荐
- mysql通过event和存储过程实时更新简单Demo
今天想稍微了解一下存储过程和EVENT事件,最好的方法还是直接做一个简单的demo吧 首先可以在mysql表中创建一个users表 除了设置一些username,password等必要字段以外还要设立 ...
- filter 拦截ajax请求
1.filterpublic class SessonFilter implements Filter { private static Logger log = LoggerFactory.getL ...
- Android在应用设置里关闭权限,返回生命周期处理
问题 在处理6.0运行时权限时,很多人都忽略了这样一个问题: 在一个App应用里,如果已经允许了一个权限比如(读取通讯权限),此刻去调用相机,弹出权限申请对话框,此刻点击拒绝,然后经过处理后弹出去设置 ...
- cocos2d-x 配置教程
下载cocos2d-x并解压(解压的路径不要带空格,不然以后用cygwin编译工程的时候会出现错误),我的解压到了D:\cocos2d-2.1rc0-x-2.1.2(我的版本是cocos2d-2.1r ...
- 模块化Java简介
什么是模块化? 模块化是个一般概念,这一概念也适用于软件开发,可以让软件按模块单独开发,各模块通常都用一个标准化的接口来进行通信.实际上,除了规模大小有区别外,面向对象语言中对象之间的关注点分离与 ...
- hdu-3549 Flow Problem---最大流模板题(dinic算法模板)
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=3549 题目大意: 给有向图,求1-n的最大流 解题思路: 直接套模板,注意有重边 传送门:网络流入门 ...
- 实现带查询功能的ComboBox控件
实现效果: 知识运用: ComboBox控件的AutoCompleteMode属性 public AutoCompleteMode AutoCompleteMode{get;set;} //属性值为枚 ...
- systemd 中的requires, wants, before, after
man systemd.unit man systemd.service ###依赖关系和前后顺序* 依赖关系:Requires和Wants * 前后顺序:After,Before 依赖关系,前 ...
- Java代码工具箱之超出游标最大数
1. Java大量写入oracle时容易出现此错.经过此错,也触动自己要深刻理解 java 的 prepareStatement 等对象,及数据库的连接与释放. 2. 原因:经常会出现在 for 循环 ...
- Sass和gulp的简单了解
一.sass less css预处理器 sass里面有2种语法 第一种语法是sass 后缀名必须是sass 第二种语法是scss 后缀名必须是scss ...