您的位置:首页 > Web前端 > JavaScript

关于javascript中的回调函数

2012-10-09 23:12 253 查看
考虑一个这样的例子:

假如某个项目的底层和高层是由不同的人员协同完成.底层负责数据的存取,高层负责数据的表示.当高层要用到某个模块的数据,于是他对底层人员说,我需要你们提供满足某种需求的数据,你给我提供一个接口.

底层的人员说:我给你提供数据,怎么展示和处理则是你的事情.我不可能为你每个需求都提供一个数据接口,我给你提供一个通过的接口.你得到数据,然后自己写函数去展示.由是经过协商,双方提供了一个这样的接口:

//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 pp=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="Just Testing。。。"

}

</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>

运行此文件,可以看到效果
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: