锁定老帖子 主题:Js的callback机制使用总结
精华帖 (0) :: 良好帖 (3) :: 新手帖 (0) :: 隐藏帖 (2)
|
|
---|---|
作者 | 正文 |
发表时间:2009-10-23
Ps:最近为了面试,看了些东西,把一些东西整理了一下,贴出来分享,也希望大家提提意见吧 *************************** Js中的callback机制,即回调,可以这么形象的来理解,一个button存在这里,我们可以add一个action,那么如果这个button被触发的时候会调用这个action。这其实就是一个callback机制。button像一个事件监听器,也是一个事件源;而action则是一个动作。 总结到js在如下几个地方常常用到: 1、动态加载(外部)js的时候,在加载完成之后进行一些操作,可以使用callback,拓展阅读:如何判断脚本加载完成、Javascript Callback的两种实现方案 2、类似的,在加载iframe时也可以通过callback执行一些操作,拓展阅读:判断 iframe 是否加载完成的完美方法 3、ajax的使用,提交请求后得到的返回值用callback机制解析使用,貌似现在大部分框架都是用得这种方式。 3、链式调用的时候,在赋值器方法中(或者本身没有返回值的方法中)很容易实现链式调用,而取值器相对来说不好实现链式调用,因为你需要取值器返回你需要的数据而不是this指针,如果要实现链式方法,可以用回调函数来实现,大家可以看看文章后面举的例子 4、settimeout、setInterval的函数调用得到其返回值,由于两个函数都是异步的,即:他们的调用时序和程序的主流程是相对独立的,所以没有办法在主体里面等待它们的返回值,它们被打开的时候程序也不会停下来等待,否则也就失去了setTimeout及setInterval的意义了,所以用return已经没有意义,只能使用callback。 5、settimeout的延迟时间为0,这个hack经常被用到,settimeout调用的函数其实就是一个callback的体现,至于想了解settimeout的这个hack,大家有兴趣可以看看realazy的文章:认识延迟时间为0 的setTimeout 6、事件处理中经常需要用到callback机制,这个在前面的例子中(button)其实已经有所体现。 7、其他一些需要在处理后进行一些额外处理的(这个比较泛,O(∩_∩)O~) 这些是我作的一个小小的总结,欢迎大家提意见和更多的想法!
附:设计一个简单的支持链式调用的类:
function Dog(name,color){ this.name=name||""; this.color=color||""; } Dog.prototype.setName=function(name){ this.name=name; return this; }; Dog.prototype.setColor(color){ this.color=color; return this; }; Dog.prototype.yelp(){ alert("我的名字叫:"+this.name+",我的颜色是:"+this.color); return this; }; 使用方式:
var dog = new Dog(); dog.setName("旺财").setColor("白色").yelp(); 如果取值器你也想支持链式调用?那么就采用回调函数来实现,将本来应该返回的值直接传给回调函数,而return仍然返回this指针。接着上面的Dog类写一个方法:
Dog.prototype.getName(callback){ callback.call(this,this.name); return this; } 使用方式:
function showName(name){ alert(name); } dog.setName("旺财").getName(showName).setColor("白色"); 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2009-10-24
比较明确的定义是: 把可执行函数作为参数,传入到其他方法内再执行的方式叫做回调
|
|
返回顶楼 | |
发表时间:2009-10-24
zzhonghe 写道
比较明确的定义是: 把可执行函数作为参数,传入到其他方法内再执行的方式叫做回调
额,感觉这个说法也欠妥,不一定是参数的传递。其实我在文章中是打了一个形象的比方,呵呵
|
|
返回顶楼 | |
发表时间:2009-10-30
写得不错,长见识了。
|
|
返回顶楼 | |
发表时间:2009-10-31
其实我希望大家能够总结提出更多的~~ |
|
返回顶楼 | |
发表时间:2009-11-03
将本来应该返回的值直接传给回调函数,而return仍然返回this指针
弱弱的指出:this指针指向的是dog对象吧,如果要获取dog对象,直接return this就行了,何必用回调去取值呢,这不是南辕北辙么。。。。。。 |
|
返回顶楼 | |
发表时间:2009-11-04
我也觉得把简单问题复杂化了,不过楼主可能是举个简单的例子吧
skyking118 写道 将本来应该返回的值直接传给回调函数,而return仍然返回this指针
弱弱的指出:this指针指向的是dog对象吧,如果要获取dog对象,直接return this就行了,何必用回调去取值呢,这不是南辕北辙么。。。。。。 |
|
返回顶楼 | |
发表时间:2009-11-04
不错,扩展阅读那几篇文字也不错!受益非浅!
楼主最近挺活跃的啊,呵呵。 |
|
返回顶楼 | |
发表时间:2009-11-04
d-jasonlee 写道
不错,扩展阅读那几篇文字也不错!受益非浅!
楼主最近挺活跃的啊,呵呵。 最近其实很忙,所以帖子里面的回复也没仔细去看了,等过一段时间了,俺再好好回复~~ 发的帖子其实是一些小结,算是一个沉淀吧,挖哈哈。。。
|
|
返回顶楼 | |
浏览 23987 次