在javascript中回调函数非常重要,它们几乎无处不在。像其他更加传统的编程语言都有回调函数概念,但是非常奇怪的是,完完整整谈论回调函数的在线教程比较少,倒是有一堆关于call()和apply()函数的,或者有一些简短的关于callback的使用示例。

  函数也是对象

  想弄明白回调函数,首先的清楚地明白函数的规则。在javascript中,函数是比较奇怪的,但它确确实实是对象。确切地说,函数是用Function()构造函数创建的Function对象。Function对象包含一个字符串,字符串包含函数的javascript代码。假如你是从C语言或者java语言转过来的,这也许看起来很奇怪,代码怎么可能是字符串?但是对于javascript来说,这很平常。数据和代码之间的区别是很模糊的。

//可以这样创建函数
var fn = new Function("arg1", "arg2", "return arg1 * arg2;");
fn(2, 3); //6

  这样做的一个好处,可以传递代码给其他函数,也可以传递正则变量或者对象(因为代码字面上只是对象而已)。

  传递函数作为回调

  很容易把一个函数作为参数传递。

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);
});    //结果为10和20之间的随机数

  可能这样做看起比较麻烦,甚至有点愚蠢,为何不正常地返回结果?但是当遇上必须使用回调函数之时,你也许就不这样认为了!

  别挡道

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

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

  下面有个更加全面的使用AJAX加载XML文件的示例,并且使用了call()函数,在请求对象(requested object)上下文中调用回调函数。

function fn(url, callback){
var httpRequest;    //创建XHR
httpRequest = window.XMLHttpRequest ? new XMLHttpRequest() :   //针对IE进行功能性检测
    window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : undefined; httpRequest.onreadystatechange = function(){
if(httpRequest.readystate === 4 && httpRequest.status === 200){  //状态判断
callback.call(httpRequest.responseXML);
}
};
httpRequest.open("GET", url);
httpRequest.send();
} fn("text.xml", function(){    //调用函数
console.log(this);   //此语句后输出
}); console.log("this will run before the above callback.");  //此语句先输出

  我们请求异步处理,意味着我们开始请求时,就告诉它们完成之时调用我们的函数。在实际情况中,onreadystatechange事件处理程序还得考虑请求失败的情况,这里我们是假设xml文件存在并且能被浏览器成功加载。这个例子中,异步函数分配给了onreadystatechange事件,因此不会立刻执行。

  最终,第二个console.log语句先执行,因为回调函数直到请求完成才执行。

  上述例子不太易于理解,那看看下面的示例:

function foo(){
var a = 10;
return function(){
a *= 2;
return a;
};
}
var f = foo();
f(); //return 20.
f(); //return 40.

  函数在外部调用,依然可以访问变量a。这都是因为javascript中的作用域是词法性的。函数式运行在定义它们的作用域中(上述例子中的foo内部的作用域),而不是运行此函数的作用域中。只要f被定义在foo中,它就可以访问foo中定义的所有的变量,即便是foo的执行已经结束。因为它的作用域会被保存下来,但也只有返回的那个函数才可以访问这个保存下来的作用域。返回一个内嵌匿名函数是创建闭包最常用的手段。

原文地址:http://www.cnblogs.com/moltboy/archive/2013/04/24/3040213.html

javascript 回调函数的更多相关文章

  1. 理解 JavaScript 回调函数并使用

    JavaScript中,函数是一等(first-class)对象:也就是说,函数是 Object 类型并且可以像其他一等对象(String,Array,Number等)一样使用.它们可以"保 ...

  2. 【JavaScript】JavaScript回调函数

    什么是Javascript 回调函数? 函数和其他数据一样可以被赋值,删除,拷贝等,所以也可以把函数作为参数传入到另一个函数中. 这个函数就是所谓的回调函数   举例: //不带参数的case fun ...

  3. 理解javascript 回调函数

    ##回调函数定义 百度百科:回调函数 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数.回调函数不 ...

  4. JavaScript回调函数的实现

    https://github.com/forsigner/blog/blob/master/source/_posts/javascript-callback.md 在JavaScript中,回调函数 ...

  5. JavaScript回调函数及数组方法测试

    JavaScript回调函数及数组方法测试 具体代码如下: <!DOCTYPE html> <html lang="en"> <head> &l ...

  6. 如何定义 Java 的回调函数,与 JavaScript 回调函数的区别

    JavaScript 中的回调函数 在 JavaScript 中经常使用回调函数,比如:get 请求.post 请求等异步任务.在我们请求之前以及请求之后,都需要完成一些固定的操作,比如:请求之前先从 ...

  7. JavaScript回调函数的理解

    这里是个人对回调函数的一段理解 <!DOCTYPE html> <html> <head> <title>回调函数</title> < ...

  8. 关于javascript 回调函数

    http://segmentfault.com/q/1010000000212522 如何避免Javascript中回调函数的嵌套? http://javascript.ruanyifeng.com/ ...

  9. javascript 回调函数应用

    回调函数是什么在学习之前还真不知道js回调函数怎么使用及作用了,下面本文章把我在学习回调函数例子给各位同学介绍一下吧,有需了解的同学不防进入参考. 回调函数原理: 我现在出发,到了通知你”这是一个异步 ...

  10. javascript回调函数笔记

    来源于:https://github.com/useaname/blog-study 在Javascript中,函数是第一类对象.意味函数可以像对象一样按照第一类被管理使用.回调函数是从一个叫函数式编 ...

随机推荐

  1. 计算机图形学 opengl版本 第三版------胡事民 第三章更多的绘图工具

    opengl  计算机图形学 第三版   第二部分   第三章更多的绘图工具 3.1   概述 第2章中  我们绘图使用的是屏幕窗口的基础坐标系    以像素为单位 屏幕坐标从左下角x从0延伸到scr ...

  2. Opencv4.0.0安装包

    这个资源是Opencv4.0.0安装包,包括Windows软件包,Android软件包,IOS软件包,还有opencv的源代码:需要的下载吧. 点击下载

  3. 【转】PHP的执行原理/执行流程

    简介 先看看下面这个过程: 我们从未手动开启过PHP的相关进程,它是随着Apache的启动而运行的: PHP通过mod_php5.so模块和Apache相连(具体说来是SAPI,即服务器应用程序编程接 ...

  4. resultMap与resultType的区别等容易混淆的概念

    都是为了表示结果集与java对象的关系 resultType只能通过属性与列的名称进行对应,并且大小写不敏感 resultType也可以是map(这样写会大小写敏感),不是自定义类型也行 result ...

  5. Codeforces Round #387 (Div. 2) 747F(数位DP)

    题目大意 给出整数k和t,需要产生一个满足以下要求的第k个十六进制数 即十六进制数每一位上的数出现的次数不超过t 首先我们先这样考虑,如果给你了0~f每个数字可以使用的次数num[i],如何求长度为L ...

  6. poj 1037 三维dp

    A decorative fence Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 7221   Accepted: 272 ...

  7. bzoj 4897 天赋 有向图的矩阵数定理

    4894: 天赋 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 104  Solved: 80[Submit][Status][Discuss] De ...

  8. mac 安装 navicat premium11.2.1400 破解版

    前言: 在 Mac 系统下 安装 navicat for mysql 时,遇到注册码的问题,适用了很多破解下载,都没有成功,现找到一篇特此记录下. Mac 下一款实用的数据库管理工具--Navicat ...

  9. Hibernate中多种方式解除延迟加载

    问题引发:因为dao使用load(),默认延迟加载的,当在biz关闭session之后,UI层无法获取对象的非id属性值 解决方案: 1.变成get,即时加载 2.用Hibernate.isIniti ...

  10. .net 过滤 sql防注入类,省地以后每次都要重新弄!

    /// <summary>    /// 过滤不安全的字符串    /// </summary>    /// <param name="Str"&g ...