频道直达
八强网 > 实务 > 制作设计 > 正文阅读
关键词

认识延迟时间为0 的setTimeout

www.8tops.com 2008-5-1 21:47:04   发布:ChenXiaNan
媒体:realazy.org  作者:Realazy
可以知道,现有的 JavaScript 引擎是单线程处理任务的。它把任务放到队列中,不会同步去执行,必须在完成一个任务后才开始另外一个任务。

. 我们来看 1 和 2。如果你能看看源代码,会发现我们的任务很简单,就是给文档增加一个 input 文本框,并聚焦和选中。请现在分别点击一下,可以看到,1 并没有能够聚焦和选中,而 2 可以。它们之间的区别在于,在执行

input.focus(); input.select();

时, 2 多了一个延迟时间为 0 的 setTimeout 的外围函数,即:

setTimeout(function(){ input.focus(); input.select(); }, 0);

按照 JavaScript: The Definitive Guide 5th 的 14.1 所说:

在实践中,setTimeout 会在其完成当前任何延宕事件的事件处理器的执行,以及完成文档当前状态更新后,告诉浏览器去启用 setTimeout 内注册的函数。

其实,这是一个把需要执行的任务从队列中跳脱的技巧。回到前面的例子,JavaScript 引擎在执行 onkeypress 时,由于没有多线程的同步执行,不可能同时去处理刚创建元素的 focusselect 事件,由于这两个事件都不在队列中,在完成 onkeypress 后,JavaScript 引擎已经丢弃了这两个事件,正如你看到的例子 1 的情况。而在例子 2 中,由于setTimeout可以把任务从某个队列中跳脱成为新队列,因而能够得到期望的结果。

这才是延迟事件为 0 的setTimeout的真正目的。在此,你可以看看例子 3,它的任务是实时更新输入的文本,现在请试试,你会发现预览区域总是落后一拍,比如你输 a, 预览区并没有出现 a, 在紧接输入 b 时, a 才不慌不忙地出现。其实我们是有办法让预览区跟输入框同步地,在此我没有给出答案,因为上面所说的,就是解决思路,try it yourself!

八强网,更多精彩在首页,
八强网首页
网友评论

发表

我也评两句
 
发文时请务必注意:
一、遵守国家相关法律规定,如 《北京地区互联网站电子公告服务倡议书》《全国人大常委会关于维护互联网安全的决定》 及中华人民共和国其他各项有关法律法规。一旦违犯法律法规,您将承担一切因您的行为而直接或间接导致的民事或刑事法律责任,本站工作人员有义务配合相关部门,提供必要的技术资料(如IP地址等)。
二、自觉遵守爱国、守法、自律、真实、文明的原则,严禁发表有人身攻击倾向、有造谣生事嫌疑的言论,严禁发表虚假广告、色情、网络传销性质的内容,本站管理人员有权删除违反规定的内容或取消违规网友的发文权限甚至删除其ID。
互联网产业作家
网站提交】【八强自荐
将八强网设为首页 将八强网添加到收藏夹 将八强网推荐给朋友 网络实名、通用网址:八强网
关于我们 - 联系合作 - 广告服务 - 友情链接 - 支持单位 - 免责声明
基于E-file技术构建 版权所有Copyright©2006 京ICP备06061834号