1、回调函数定义: 

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

  在JavaScript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。因此callback 不一定用于异步,一般同步(阻塞)的场景下也经常用到回调,比如要求执行某些操作后执行回调函数。

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

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

var func1=function(callback){

  //do something

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

}

例:异步回调的例子

$(document).ready(callback);

$.ajax({

  url: "test.html";

  context: document.body

}).done(function(){

  $(this).addClass("done");

}).fail(function(){

  alert("error");

}).always(function(){

  alert("complete");

})

在javascript中,函数也是对象,函数是用Functon()构造函数创建的Function对象。Function对象包含一个字符串,字符串包含函数的javascript代码。这样就可以将函数作为参数传递给其他函数。

把函数做为参数传递的例子:

function fn(arg1,arg2,callback){

  var num=Math.ceil(Math.random()*(arg1-arg2)+arg2);

  callback(num);

}

fn(10,20,function(num){

  console.log("Callback called! Num:"+num);

}) 

  传统函数以参数形式输入数据,并且使用返回语句返回值。理论上,在函数结尾处有一个return返回语句,结构上就是:一个输入点和一个输出点。这比较容易理解,函数本质上就是输入和输出之间实现过程的映射。

  但是,当函数的实现过程非常漫长,你是选择等待函数完成处理,还是使用回调函数进行异步处理呢?这种情况下,使用回调函数变得至关重要,例如:AJAX请求。若是使用回调函数进行处理,代码就可以继续进行其他任务,而无需空等。实际开发中,经常在javascript中使用异步调用,甚至在这里强烈推荐使用!

2、回调函数的使用场合

(1)资源加载:动态加载js文件后执行回调,加载iframe后执行回调,ajax操作回调,图片加载完成执行回调,等

(2)DOM事件及Node.js事件基于回调机制

(3)setTimeout的延迟时间为0,setTimeout调用的函数实际上就是一个callback的体现

(4)链式调用:链式调用的时候,在赋值器(setter)方法中很容易实现链式调用,而取值器(getter)相对来说不好实现链式调用,因为你需要取值器返回你需要的数据而不是this指针,如果要实现链式方法,可以用回调函数来实现setTimeout、setInterval的函数调用得到其返回值。由于两个函数都是异步的,即:他们的调用时序和程序的主流程是相对独立的,所以没有办法在主体里面等待它们的返回值,它们被打开的时候程序也不会停下来等待,否则也就失去了setTimeout及setInterval的意义了,所以用return已经没有意义,只能使用callback。callback的意义在于将timer执行的结果通知给代理函数进行及时处理。

3、回调函数的传递

$.get('myhtmlpage.html',myCallBack); //这是对的

$.get('myhtmlpage.html',myCallBack('foo','bar'));   //这是错的,若要带参数实现如下

$.get('myhtmlpage.html',function(){

  //带参数的函数表达式

  myCallBack('foo','bar');

});

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

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

参考原文:http://www.jb51.net/article/54750.htm

 

Javascript之回调函数(callback)的更多相关文章

  1. 理解javascript中的回调函数(callback)

    以下内容来源于:http://www.jb51.net/article/54641.htm 最近在看 express,满眼看去,到处是以函数作为参数的回调函数的使用.如果这个概念理解不了,nodejs ...

  2. 理解javascript中的回调函数(callback)【转】

    在JavaScrip中,function是内置的类对象,也就是说它是一种类型的对象,可以和其它String.Array.Number.Object类的对象一样用于内置对象的管理.因为function实 ...

  3. JavaScript系列之回调函数callback

    JavaScript系列之回调函数callback JavaScript回调函数的使用是很常见的,引用官方回调函数的定义: A callback is a function that is passe ...

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

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

  5. JS回调函数(callback)

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

  6. 解决有关flask-socketio中服务端和客户端回调函数callback参数的问题(全网最全)

    由于工作当中需要用的flask_socketio,所以自己学习了一下如何使用,查阅了有关文档,当看到回调函数callback的时候,发现文档里都描述的不太清楚,最后终于琢磨出来了,分享给有需要的朋友 ...

  7. 回调函数callback使用例子

    代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="GBK" /> <tit ...

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

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

  9. 什么是javascript的回调函数?

    回调函数(callback) 基本上每本书里都会提一提实际上我们几乎每天都在用回调函数,那么如果问你到底什么是回调函数呢? 1. 回调函数是作为参数传递给另一个函数 2. 函数运行到某种程度时,执行回 ...

  10. java基础-回调函数(callback)

    java基础-回调函数(callback) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数 ...

随机推荐

  1. http://www.cnblogs.com/dumuqiao/p/3654702.html?utm_source=tuicool&utm_medium=referral

    http://www.cnblogs.com/dumuqiao/p/3654702.html?utm_source=tuicool&utm_medium=referral

  2. C#中static静态变量的用法

    使用 static 修饰符声明属于类型本身而不是属于特定对象的静态成员static修饰符可用于类.字段.方法.属性.运算符.事件和构造函数,但不能用于索引器.析构函数或类以外的类型 静态全局变量 定义 ...

  3. iOS 冒泡排序

    //冒泡排序 -(NSArray*)Bubble_Sort:(NSArray*)oldArray { NSMutableArray * newArray = [NSMutableArray array ...

  4. LeetCode Flip Game II

    原题链接在这里:https://leetcode.com/problems/flip-game-ii/ 题目: You are playing the following Flip Game with ...

  5. Interview Question

    HDS(11.16.2015): How to design an non-stop website like Google or Amazon? What design patterns are y ...

  6. python基础篇-day1

    python基础篇 python是由C语言写的: pass 占位符: del,python中全局的功能,删除内存中的数据: 变量赋值的方法: user,pass = 'freddy','freddy1 ...

  7. ionic一些常见问题及方法

    1.打包的app无法访问互联网及网络资源(比如网页调试可以请求数据,安装到手机上无法请求数据) 添加白名单插件 ionic plugin add https://github.com/apache/c ...

  8. 在Visual Studio 2015中运行OPENGL

    Starting an OpenGL project in VS 2015 is really easy, thanks to the NupenGL.Core nuget package. Here ...

  9. Android 通过Base64上传图片到服务器

    之前做上传图片是采用HttpServlet上传,不过用了一下Base64上传图片后,感觉比HttpServlet方便很多,大家也可以跟着尝试一下. 前台图片处理:(传Bitmap对象即可) /** * ...

  10. TFS 2013 配置的时候,提示TF255466错误

    TFS 2010 配置的时候,提示TF255466错误  花舞花落泪 2013-11-08 10:19:37 在验证是否可以安装 SharePoint 时的提示,Error [ System Chec ...