纠结了很久的js回调函数

自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗。迅速google之,发现原来中文翻译成回调。也就是回调函数了。不懂啊,于是在google回调函数,发现网上的中文解释实在是太“深奥”了,我承认自己才疏学浅了。看了几个回调的例子后,貌似有点理解了。下面是我对回调函数的理解,要是理解错了,请指正,不甚感激。

        首先还是从jquery网站上的英文定义入手,身为国人,我真感到悲剧。一个回调的定义被国内的“高手”解释成什么样,就在那绕圈子,貌似只有把你绕进去了,他才算高手。浮云,一切都是浮云。

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

这是js里的解释了,其他语言的算我没说。

字面上理解下来就是,回调就是一个函数的调用过程。那么就从理解这个调用过程开始吧。函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b。那么这个过程就叫回调。

其实中文也很好理解:回调,回调,就是回头调用的意思。函数a的事先干完,回头再调用函数b。

举个现实的例子:约会结束后你送你女朋友回家,离别时,你肯定会说:“到家了给我发条信息,我很担心你。”对不,然后你女朋友回家以后还真给你发了条信息。小伙子,你有戏了。

其实这就是一个回调的过程。你留了个函数b(要求女朋友给你发条信息)给你女朋友,然后你女朋友回家,回家的动作是函数a。她必须先回到家以后,函数a的内容执行完了,再执行函数b,然后你就收到一条信息了。

这里必须清楚一点:函数b是你以参数形式传给函数a的,那么函数b就叫回调函数。

 也许有人有疑问了:一定要以参数形式传过去吗,我不可以直接在函数a里面调用函数b吗?确实可以。求解中。

<解惑:如果你直接在函数a里调用的话,那么这个回调函数就被限制死了。但是使用函数做参数就有下面的好处:当你a(b)的时候函数b就成了回调函数,而你还可以a(c)这个时候,函数c就成了回调函数。如果你写成了function a(){...;b();}就失去了变量的灵活性。>

下面用代码来证实我的理解。

 

[html]  view plain  copy
  1. <html>   
  2.    
  3. <head>   
  4.    
  5. <title>回调函数(callback)</title>   
  6. <script language="javascript" type="text/javascript">   
  7. function a(callback)   
  8. {      
  9.    alert("我是parent函数a!");   
  10.     alert("调用回调函数");   
  11.     callback();   
  12. }   
  13. function b(){   
  14. alert("我是回调函数b");   
  15.   
  16. }   
  17. function c(){   
  18. alert("我是回调函数c");   
  19.   
  20. }   
  21.   
  22. function test()   
  23. {   
  24.     a(b);   
  25.    a(c);   
  26. }   
  27.   
  28. </script>   
  29. </head>   
  30.    
  31. <body>   
  32. <h1>学习js回调函数</h1>   
  33. <button onClick=test()>click me</button>   
  34. <p>应该能看到调用了两个回调函数</p>   
  35. </body>   
  36.    
  37. </html>  


 以上是大神的观点,下面是我自己的补充:

首先了解一下匿名函数

为什么要创建匿名函数呢?在什么情况下会使用到匿名函数。匿名函数主要有两种常用的场景,一是回调函数,二是直接执行函数。

回调函数,像ajax的异步操作,就需要回调函数。这里就不详解。关于直接执行函数,我看一个例子就明白了:

复制代码代码如下:
<script language="javascript">
var a = "a";
(function(){
    var a="b";
    alert(a);
})();
alert(a);
</script>

匿名函数的调用

要调用一个函数,我们必须要有方法定位它,引用它。所以,我们会需要帮它找一个名字。例如:

复制代码代码如下:
var abc=function(x,y){ 
return x+y; 

alert(abc(2,3)); // "5"

对匿名函数的调用其实还有一种做法,也就是我们看到的jQuery 片段—— 使用() 将匿名函数括起来,然后后面再加一对小括号(包含参数列表)。我们再看一下以下例子:

复制代码代码如下:
alert((function(x,y){return x+y;})(2,3));// "5" 
alert((new Function("x","y","return x*y;"))(2,3));// "6"


一、为什么要使用回调函数

1math函数要实现bbccdd中函数一个功能,每次都得改函数名字

 

2、比如说math函数要实现bbccdd中的至少两个函数的功能,那么又得在写一个math1函数去调用另一个函数

 

解决:把一个函数的指针(函数名)作为另一个函数的参数,这时候调用math函数只需要传入不同的函数指针就能调用不同功能的函数


二、简单的回调函数(即:没有使用函数指针,在一个函数中调用执行另一个函数)



三、

1、有函数名的函数,函数名作为函数指针,上面大神已经讲了;

2、匿名函数代替函数指针

由于匿名函数没有函数,匿名函数的整体函数代码就相当于一个函数指针,所以匿名函数就不需要单独定义,调用父函数的时候代替函数指针作为参数,而且这样匿名函数代码出现就是已经定义这个匿名函数

[html]  view plain  copy
  1. function aa(callback){
  2. alert("我是父函数");
  3. alert("执行回调函数");
  4. callback();
  5. }
  6.   aa(function(){
    alert("我是回调函数");
      })
上面代码执行完父函数的内容,就执行回调函数

3、定义父函数同时执行父函数

  1. alert( (function aa(num1,num2,fun){

    return fun(num1,num2)

    })(2,3,function (num1,num2){return (num1+num2)*2}) )




关于模拟jquery封装ajax请求中回调函数的分析:(day23_3)

 

ajax请求封装为一个工具文件ajaxutils.js,即封装ajax请求方法

 

下面ajax函数就相当于一个父函数,参数是optionjson数据对象:是URLcallback回调函数作为参数等参数的封装体)

1、定义的函数 匿名函数作为函数参数

 




 

data获得服务器响应的文本数据,在调用回调函数作为实参传递给在json3.jsp中定义的回调函数的形 参

2Json3.jsp调用父函数ajax(option),同时定义一个匿名函数代替函数指针作为形参


 

jQuery中回调函数什么时候执行

this(特别注意回调函数中this代表谁)

 

 


day44_jquery/ajax/ex01/user.js

下面回调函数在click这个函数内部执行,这里click函数是jquery内部的函数

在回调函数内部写一个this,即:在click函数的内部,谁调用回调函数,this就代表谁

 

 



关于原始封装ajax请求封装,回调函数里面的this分析

1、定义封装ajax请求的函数(参数一个json对象)

 


2、调用ajax封装函数(匿名函数在此时定义,匿名函数没有函数指针 即:函数名,

所以定义的时候,就把自己作为替换函数指针作为实参传给调用ajax封装函数)

 

因为上面定义ajax函数形参为ajaxJSON对象,把所有参数作为json对象封装,

ajax函数自己部分执行,调用上面回调函数部分,是json对象调用了回调函数

 

3、post方法中的回调函数

下面是post的方法调用,post方法定义在jquery内核

 

 

$delA触发click事件,调用回调函数

观点:上面的ajax函数把所有参数都封装到json对象中

要取出回调函数,必须使用json对象去区

post中回调函数单独定义的,且定义的同时也作为参数

在一个函数中调用另一个函数是通过:函数指针();

且一个A函数里面的实参函数给这个定义的A函数的的形参,在通过定义的A函数里面的变量接收使用,所以没有json对象还A这个函数调用了实参

这把匿名函数传给callbackdata),还在post函数里面进行,把匿名函数给了callback,后面()就代表运行匿名函数

这里也就跟在一个函数调用另一个函数一样,凡事定义的函数,都能在里一个函数中调用,不管这个函数定义在哪,这里定义的函数只不过定义在了作为参数的地方,为什么也定义在一个函数的参数位置?匿名函数作为回调函数,我觉得方便使用,定义的同时又代替函数指针作为参数,因为没有函数名,定义的时候刚好也把它用了

不是匿名函数作为回调函数,一个math在一个js文件中重复实现多个功能使用回调函数

 

1math函数要实现bbccdd中函数一个功能,每次都得改函数名字

 

2、比如说math函数要实现bbccdd中的至少两个函数的功能,那么又得在写一个math1函数去调用另一个函数

 

解决:把一个函数的指针(函数名)作为另一个函数的参数,这时候调用math函数只需要传入不同的函数指针就能调用不同功能的函数


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值