很经常我们会遇到这样一种情况:

例如,你需要和其他人合作,别人提供数据,而你不需要关注别人获取或者构建数据的方式方法。

你只要对这个拿到的数据进行操作。

这样,就相当于我们提供一个外在的函数,别人调用这个函数,返回相应的数据。

例如:

1
2
3
4
5
6
7
8
function (num , numFun) {
if(num < 10){
//do sth
}else {
//do sth
numFun();
}
}

在num的判断之后执行NumFun的函数。

所谓的回调函数,可以这样理解,它是为了实现这样一个目的:

draw方法是一个绘图的函数

现在我们调用这个draw方法,希望在图形绘制完成之后,我们能够进行相应的操作,为了保证这个操作是在绘图完成之后调用的。

我们就采取这样一种方法,将fun作为参数传递进draw,然后再draw函数执行完成之后,调用这个传递的fun方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function draw(beforeDraw, afterDraw) {
beforeDraw();
//绘图
//dosth
 
afterDraw();
}
 
//别人调用
draw(function(){
alert('绘图之前执行');
//绘图之前,do sth
},
function(){
alert('绘图之后执行');
//绘图之后,do sth
})

当然利用这种思想,我们可以在很多地方有很巧妙的使用:

比如之前举得例子

你只关注数据的返回值,不关注别人调用这个方法是怎么操作的。

方法1:

就可以利用回调函数的思想,定义方法传入的参数为函数,别人调用是,在函数参数中执行相应的操作,然后返回你所需要的值:

1
2
3
4
5
6
7
8
var drawBase = {
init : function (getdata){
  var mydata = getdata();
 $('#testID').bind('click', function(e){
  //利用mydata进行绘图操作
})
},
}

//别人在调用你这个函数时候,传入的参数为函数,函数中进行操作后返回相应的值

1
2
3
4
5
drawBase.init(function () {
//do sth
一系列操作之后
return data;
})

方法2、

你也可以,先定义一个空方法,然后别人再去重写这个方法,进行一系列的操作之后,返回相应的数据

然后我们使用时候,就可以拿到这个返回的数据了:

Exp:

1
2
3
4
5
6
7
8
9
var drawBase = {
getdata = { },
init : function () {
$('testID').bind('click', function () {
  var data = drawBase.getdata();
//使用data进行你所需要的操作
})
}
}

//别人调用时候,就需要重写这个方法

1
2
3
4
drawBase.getData = function () {
   //一系列操作,得到data,
 return data;
}

这两种方法可以这样理解:

方法一,绑定事件和操作,是在别人调用时候才做的,因此那个时候getdata()的方法是已知的可以直接绑定

方法二,绑定的事件和操作,是之前进行的,此时不知道getdata()的方法,因而给定一个空的方法定义,在别人调用重写后,就可以拿到相应的数据

这个是我个人的一些看法~

Exp:

1
2
3
4
5
6
7
8
var stu={
    init : function(callback){
        //TODO ...
        if(callback && (callback  instanceof Function){
              callback('init...');//回调
        }
    }
};

别人调用,传入函数参数:

1
2
3
stu.init(function(){
     //这就是回调了...
});

加油!

JS 对于回调函数的理解,和常见的使用场景应用,使用注意点的更多相关文章

  1. js中的回调函数的理解和使用方法

    js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...

  2. js回调函数(callback)理解

    Mark! js学习 不喜欢js,但是喜欢jquery,不解释. 自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速google之,发现原来中文翻译成回调.也就是回调函 ...

  3. js回调函数的理解

    js回调函数(callback)理解 Mark! 讲之前说一句 function say(){ alert(,,,,,,,,) } var say=function (){ alert(,,,,,,, ...

  4. 关于js的回调函数的一点看法

    算了一下又有好几个月没写博客了,最近在忙公司android的项目,所以也就很少抽时间来写些东西了.刚闲下来,我就翻了翻之前看的东西.做了android之后更加感觉到手机端开发的重要性,现在做nativ ...

  5. js的回调函数详解

    本文主要介绍了个人对于javascript中回调函数的理解和使用方法及示例,需要的朋友可以参考下   现在做native App  和Web App是主流,也就是说现在各种基于浏览器的web app框 ...

  6. JavaScript callback function 回调函数的理解

    来源于:http://mao.li/javascript/javascript-callback-function/ 看到segmentfault上的这个问题 JavaScript 回调函数怎么理解, ...

  7. 回调函数透彻理解Java

    http://blog.csdn.net/allen_zhao_2012/article/details/8056665 回调函数透彻理解Java 标签: classjavastringinterfa ...

  8. JS高阶函数的理解(函数作为参数传递)

    JS高阶函数的理解 高阶函数是指至少满足下列条件之一的函数. · 函数可以作为参数被传递 · 函数可以作为返回值输出 一个例子,我们想在页面中创建100个div节点,这是一种写法.我们发现并不是所有用 ...

  9. js中的回调函数的理解

    一,常见的但是不是特别注意的回调方法. 1.1,ajax $.ajax({ url:"test.json", type: "GET", data: {usern ...

随机推荐

  1. 移动端,点击a标签链接的pdf报错 Resource interpreted as Document but transferred with MIME type application/pdf

    源码: <a href="11.pdf" class="actcont_a fl report_a" style="display: block ...

  2. C# 连接 postgres失败

    小程序完成了,要发布到客户的服务器上: 我的测试机:win10  64             数据库:PG9.6.5     64 客户服务器:win7    32             数据库: ...

  3. node模拟后台返回json书写格式报错--Unexpected token ' in JSON at position 1

    最近在学习Node的知识,就尝试写了一个注册登陆的简单功能,但是自己在模拟后台返回值的时候,总是报错Unexpected token ' in JSON at position 1,查找原因之后,是因 ...

  4. 三种zigbee网络架构详解

    在万物互联的背景下,zigbee网络应用越加广泛,zigbee技术具有强大的组网能力,可以形成星型.树型和网状网,三种zigbee网络结构各有优势,可以根据实际项目需要来选择合适的zigbee网络结构 ...

  5. 为Visual Studio 2012添加MSDN离线帮助

    之前有网络的情况下,一直使用的都是在线的,最近又有笔记本上面有时使用时没有网络,所以就想使用下离线的MSDN包.可是找了半天,发现都是需要再次进行下载的.VS2012使用的帮助程序是HelpViewe ...

  6. hdu-3549 Flow Problem---最大流模板题(dinic算法模板)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=3549 题目大意: 给有向图,求1-n的最大流 解题思路: 直接套模板,注意有重边 传送门:网络流入门 ...

  7. 扫描局域网ip的shell

    # vim /mysh/ipscan.sh #!/bin/bash # scan the local alive ipaddress # -- if [ -f $filename ];then ech ...

  8. java编程基础——从上往下打印二叉树

    题目描述 从上往下打印出二叉树的每个节点,同层节点从左至右打印. 题目代码 /** * 从上往下打印出二叉树的每个节点,同层节点从左至右打印. * Created by YuKai Fan on 20 ...

  9. BundleConfig的作用

    在ASP.NET MVC4中(在WebForm中应该也有),有一个叫做Bundle的东西,它用来将js和css进行压缩(多个文件可以打包成一个文件),并且可以区分调试和非调试,在调试时不进行压缩,以原 ...

  10. git系列讲解

    1.git是什么呢?维基百科给出的定义: git是一个分布式版本控制软件,最初由(Linus Torvalds)创作 什么是版本控制?项目经理与程序员的恩怨情仇企业真实案例:开发了a功能,之后项目所要 ...