概述:

回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。

定义:

在JavaScript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。

因此callback 不一定用于异步,一般同步(阻塞)的场景下也经常用到回调,比如要求执行某些操作后执行回调函数。

例子

一个同步(阻塞)中使用回调的例子,目的是在func1代码执行完成后执行func2。

var func1=function(callback){
//do something.
(callback && typeof(callback) === "function") && callback();
} func1(func2);
var func2=function(){
}

  

异步回调的例子:

 
$(document).ready(callback);

$.ajax({
url: "test.html",
context: document.body
}).done(function() {
$(this).addClass("done");
}).fail(function() { alert("error");
}).always(function() { alert("complete");
});
/**
注意的是,ajax请求确实是异步的,不过这请求是由浏览器新开一个线程请求,
当请求的状态变更时,如果先前已设置回调,这异步线程就产生状态变更事件放到 JavaScript引擎的处理队列中等待处理。
见:http://www.phpv.net/html/1700.html
*/

  

回调什么时候执行

回调函数,一般在同步情境下是最后执行的,而在异步情境下有可能不执行,因为事件没有被触发或者条件不满足。

回调函数的使用场合

  • 资源加载:动态加载js文件后执行回调,加载iframe后执行回调,ajax操作回调,图片加载完成执行回调,AJAX等等。
  • DOM事件及Node.js事件基于回调机制(Node.js回调可能会出现多层回调嵌套的问题)。
  • setTimeout的延迟时间为0,这个hack经常被用到,settimeout调用的函数其实就是一个callback的体现
  • 链式调用:链式调用的时候,在赋值器(setter)方法中(或者本身没有返回值的方法中)很容易实现链式调用,而取值器(getter)相对来说不好实现链式调用,因为你需要取值器返回你需要的数据而不是this指针,如果要实现链式方法,可以用回调函数来实现
  • setTimeout、setInterval的函数调用得到其返回值。由于两个函数都是异步的,即:他们的调用时序和程序的主流程是相对独立的,所以没有办法在主体里面等待它们的返回值,它们被打开的时候程序也不会停下来等待,否则也就失去了setTimeout及setInterval的意义了,所以用return已经没有意义,只能使用callback。callback的意义在于将timer执行的结果通知给代理函数进行及时处理。

回调函数的传递

上面说了,要将函数引用或者函数表达式作为参数传递。

$.get('myhtmlpage.html', myCallBack);//这是对的
$.get('myhtmlpage.html', myCallBack('foo', 'bar'));//这是错的,那么要带参数呢?
$.get('myhtmlpage.html', function(){//带参数的使用函数表达式
myCallBack('foo', 'bar');
});

  

另外,最好保证回调存在且必须是函数引用或者函数表达式:

(callback && typeof(callback) === "function") && callback();

  

说了那么多有点懵圈?好吧,非逼我出绝招!!!

问:你有事去隔壁寝室找同学,发现人不在,你怎么办呢?
方法1,每隔几分钟再去趟隔壁寝室,看人在不
方法2,拜托与他同寝室的人,看到他回来时叫一下你 前者是轮询,后者是回调。 那你说,我直接在隔壁寝室等到同学回来可以吗? 可以啊,只不过这样原本你可以省下时间做其他事,现在必须浪费在等待上了。把原来的非阻塞的异步调用变成了阻塞的同步调用。 JavaScript的回调是在异步调用场景下使用的,使用回调性能好于轮询。

  实际上也可以看做是递归调用的一个变体!

随你怎么理解好了。

JS回调函数(理解篇)的更多相关文章

  1. JS回调函数深入篇

    <有些错别字> 在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用.既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中 ...

  2. js 回调函数理解与应用

    定义:在JavaScript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A.我们就说函数A叫做回调函数.如果没有名称(函数表达式),就叫做匿名回调函 ...

  3. js 回调函数理解

    function A(callback) { console.log('我是主函数'); setTimeout(function () { callback("我是主函数传出的") ...

  4. 如何理解JS回调函数

    1.回调函数英文解释: A callback is a function that is passed as an argument to another function and is execut ...

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

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

  6. js回调函数的理解

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

  7. js回调函数(callback)(转载)

    学习jquery时,对回调函数感觉很困惑,在晚上找了半天,忽然发现这篇文章很浅显,基本说明了问题.故转载 原文: 自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速go ...

  8. JS回调函数全解析教程

    转自:http://blog.csdn.net/lulei9876/article/details/8494337 自学jQuery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速g ...

  9. JS回调函数(callback)

    在使用Jquery的时候,用到Callback(),回调函数的概念.而且很多. 比如: $.ajax({ url:"test.json", type: "GET" ...

  10. js回调函数

    自学jQuery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速google之,发现原来中文翻译成回调.也就是回调函数了.不懂啊,于是在google回调函数,发现网上的中文解释实在是 ...

随机推荐

  1. TreeMap读源码总结

    红黑树: 定义 A red–black tree is a kind of self-balancing binary search tree in computer science. Each no ...

  2. SQL常用性能统计语句

    1.查看SQL语句IO消耗 set statistics io on     sql 语句 set statistics io off 2.查看SQL语句时间消耗 set statistics tim ...

  3. PHP、thinkPHP5.0开发网站文件管理功能(四)下载文件

    public function download($currdir = null){ $file = urldecode($currdir); $file = iconv('UTF-8', " ...

  4. Win10磁盘占用率过高

    打开服务 禁用Superfetch 禁用Windows Search 禁用Connected User Experiences and Telemetry 禁用Windows Update[恢复选项卡 ...

  5. oracle impdp时卡死Processing object type SCHEMA_EXPORT/TABLE/INDEX/INDEX

    今天在用impdp导入时,Processing object type SCHEMA_EXPORT/TABLE/INDEX/INDEX卡在建索引的过程一直不动,也不报错,重试了好几遍还是这样. 后来恍 ...

  6. Android中当前Activity跳转到当前Activity页面

    步骤:先关闭自己,在跳转 case R.id.btn_copy:// 复制 Toast.makeText(mContext, "正在复制", Toast.LENGTH_SHORT) ...

  7. 读<<programming ruby>> 7.6节 flip-flop 理解

    书中源码是这样的 File.foreach('1.txt') do |x| if(($. == 1) || x =~ /eig/) .. (($. == 3) || x =~ /nin/) then ...

  8. pat1087. All Roads Lead to Rome (30)

    1087. All Roads Lead to Rome (30) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yu ...

  9. Apache-ant安装以及环境变量配置、验证

    (一)安装 ant 下载地址: http://ant.apache.org/     根据自己电脑下载对应版本 下载完成以后,可自行解压到自己常用的盘中,但是要记住解压到哪里了,以便后续的环境变量配置 ...

  10. Homebrew 配置

    使用ruby脚本安装完成homebrew之后, 需要配置三个源以及添加一些环境变量 1. export HOMEBREW_NO_AUTO_UPDATE=true # 不自动检查更新 2. cd $(b ...