javascript的回调函数应用示例
2014-02-20 00:00
239 查看
回调函数概念:回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数。
JS Api 里这样解释:A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.
使用回调函数的原因:可以把调用者与被调用者分开。调用者不关心谁是被调用者,所有它需知道的,只是存在一个具有某种特定原型、某些限制条件(如返回值为int)的被调用函数。
考虑一个这样的例子:
假如某个项目的底层和高层是由不同的人员协同完成.底层负责数据的存取,高层负责数据的表示.当高层要用到某个模块的数据,于是他对底层人员说,我需要你们提供满足某种需求的数据,你给我提供一个接口.
底层的人员说:我给你提供数据,怎么展示和处理则是你的事情.我不可能为你每个需求都提供一个数据接口,我给你提供一个通过的接口.你得到数据,然后自己写函数去展示.由是经过协商,双方提供了一个这样的接口:
我可能还没说清楚,我们看个例子一下子就明白了
运行此文件,可以看到效果
JS Api 里这样解释:A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.
使用回调函数的原因:可以把调用者与被调用者分开。调用者不关心谁是被调用者,所有它需知道的,只是存在一个具有某种特定原型、某些限制条件(如返回值为int)的被调用函数。
考虑一个这样的例子:
假如某个项目的底层和高层是由不同的人员协同完成.底层负责数据的存取,高层负责数据的表示.当高层要用到某个模块的数据,于是他对底层人员说,我需要你们提供满足某种需求的数据,你给我提供一个接口.
底层的人员说:我给你提供数据,怎么展示和处理则是你的事情.我不可能为你每个需求都提供一个数据接口,我给你提供一个通过的接口.你得到数据,然后自己写函数去展示.由是经过协商,双方提供了一个这样的接口:
//data表示底层提供的数据源,funcName表示高层的调用函数 function(data,funcName){ 1.data属于情形1,由底层处理; 2.data属于情形2,由高层处理,怎么处理呢?利用高层提供的函数funcName处理 ..... }
我可能还没说清楚,我们看个例子一下子就明白了
//假如提供的数据源是一整数,为某学生的分数,当num<=0,由底层处理,当n>0时由高层处理. //将下面这个函数拷贝下来存盘为1.js function f(num,callback){ if(num<0) { alert("调用低层函数处理!"); alert("分数不能为负,输入错误!"); }else if(num==0){ alert("调用低层函数处理!"); alert("该学生可能未参加考试!"); }else{ alert("调用高层函数处理!"); callback(); } }
//将下面这个test.html文件存盘与1.js在一个目录下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script src="1.js" type="text/javascript"></script> <title>无标题文档</title> <script type="text/javascript"> function test(){ var p=document.getElementById("pp"); pp.innerText=""; var num=document.getElementById("score").value; f(num,function(){ //匿名高层处理函数 if(num<60) alert("未及格!"); else if(num<=90) alert("该生成绩优良!"); else alert("该生成绩优秀!"); }) pp.innerText="by since1978 qq558064!" } </script> </head> <body> <p> 回调函数示例:当学生成绩score<=0分时候,由底层处理;当score>0时,由高层处理。 </p> 请输入学生成绩<input type="text" id="score"> <input type="button" onClick="test()" value=" 看看结果"> <p id="pp"></p> </body> </html>
运行此文件,可以看到效果
相关文章推荐
- JavaScript之递归和回调函数的应用
- JavaScript的arguments对象应用示例
- JavaScript eval() 函数介绍及应用示例
- Javascript中的回调函数和匿名函数的回调示例介绍
- JavaScript - XMLHttpRequest 应用示例(传输二进制数据、JSON 字符串,监测进度)
- JavaScript中奇葩的假值示例应用
- JavaScript回调函数应用浅析
- javascript中的绑定与解绑函数应用示例
- Rudolph javascript 监听简单对象属性的变化 -- 回调函数的应用
- JavaScript的arguments对象应用示例
- javascript中的绑定与解绑函数应用示例
- 这是我用 javascript 制作的“Dual listbox”(双向选择器)的一个应用示例
- 浅析JavaScript回调函数应用
- JavaScript回调函数应用理解浅析
- javascript匿名函数应用示例介绍
- ASP.Net中应用Javascript的示例(引)
- javascript 自定义回调函数示例代码
- JavaScript中奇葩的假值示例应用
- javascript 自定义回调函数示例代码