js中回调函数的学习笔记

回调函数是什么在学习之前还真不知道js回调函数怎么使用及作用了，下面本文章把我在学习回调函数例子给各位同学介绍一下吧，有需了解的同学不防进入参考。
回调函数原理：
我现在出发，到了通知你”
这是一个异步的流程，“我出发”这个过程中（函数执行），“你”可以去做任何事，“到了”（函数执行完毕）“通知你”（回调）进行之后的流程
例子
1.基本方法

<script language="javascript" type="text/javascript">function doSomething（callback） {// … // Call the callbackcallback（"stuff", "goes", "here"）;} function foo（a, b, c） {// I"m the callbackalert（a + " " + b + " " + c）;} doSomething（foo）; </script>

或者用匿名函数的形式

<script language="javascript" type="text/javascript"> function dosomething（damsg, callback）{alert（damsg）;if（typeof callback == "function"） callback（）; } dosomething（"回调函数", function（）{alert（"和 jQuery 的 callbacks 形式一样！"）; }）; </script>

2.高级方法

使用javascript的call方法

<script language="javascript" type="text/javascript">function Thing（name） {this.name = name;}Thing.prototype.doSomething = function（callback） {// Call our callback, but using our own instance as the contextcallback.call（this）;} function foo（） {alert（this.name）;} var t = new Thing（"Joe"）;t.doSomething（foo）; // Alerts "Joe" via `foo`</script>

传参数

<script language="javascript" type="text/javascript"> function Thing（name） {this.name = name;}Thing.prototype.doSomething = function（callback, salutation） {// Call our callback, but using our own instance as the contextcallback.call（this, salutation）;} function foo（salutation） {alert（salutation + " " + this.name）;} var t = new Thing（"Joe"）;t.doSomething（foo, "Hi"）; // Alerts "Hi Joe" via `foo`</script>

使用 javascript 的 apply 传参数

<script language="javascript" type="text/javascript">function Thing（name） {this.name = name;}Thing.prototype.doSomething = function（callback） {// Call our callback, but using our own instance as the contextcallback.apply（this, ["Hi", 3, 2, 1]）;} function foo（salutation, three, two, one） {alert（salutation + " " + this.name + " – " + three + " " + two + " " + one）;} var t = new Thing（"Joe"）;t.doSomething（foo）; // Alerts "Hi Joe – 3 2 1" via `foo`</script>

例子
//假如提供的数据源是一整数,为某学生的分数,当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中的回调模式：
形如：

function writeCode（callback）{//执行一些事物，callback（）;//... }function intrduceBugs（）{//....引入漏洞 }writeCode（intrduceBugs）;

我们传递函数的应用给writeCode（），让writeCode在适当的时候来执行它（返回以后调用）
先看一个不怎么好的例子（后续要对其重构）：

//模拟查找页面中的dom节点，将查找到的节点存在数组里面统一返回 //此函数只用于查找不对dom节点做任何的逻辑处理 var findNodes = function（）{var i = 100000;//大量的循环，var nodes = [];//用于存储找到的dom节点var found;while（i）{ i -=1; nodes.push（found）;}return nodes; }//将查找找到的dom节点全部隐藏 var hide = function（nodes）{var i = 0, max = nodes.length;for（;i<max;i++）{ //findNodes后面有括号代表立即执行，先执行findNodes（）然后执行hide（）< hide（findNodes（））; 执行函数 } ; nodes[i].style.display="none"}上面的方法是低效的，以为hide（）必须再次遍历有findNodes（）返回的数组节点，如何避免这种多余的循环呢。 我们不能直接在findNodes中对查询到的节点进行隐藏（这样检索就可修改逻辑耦合了），那么他就不再是一个通用函数了。 解决方法是用回调模式，可以将节点隐藏逻辑以回调函数方式传递给findNodes（）并委托其执行//重构findNodes以接受一个回调函数var findNodes = fucntion（callback）{ var i = 100000,nodes = [],found; //检查回调函数是否可用调用的 if（typeof callback ！== "function"）{callback = false; } while（i）{i -= 1;if（callback）{ callback（found）;}nodes.push（found）; } return nodes;} //回调函数var hide = function（node）{ node.style.display = "none ";}//找到后续节点并在后续执行中对其进行隐藏findNodes（hide）;//先执行findNodes然后执行hide，当然回调函数也可以在调用主函数时创建：findNodes（function（node）{node.style.display = "none";}）;