js 中实现sleep函数

简介:

除了Narrative JS,jwacs(Javascript With Advanced Continuation Support) 也致力于通过扩展JavaScript语法来避免编写让人头痛的异步调用的回调函数。用jwacs 实现的sleep,代码是这样:

function sleep(msec) {

var k = function_continuation;
setTimeout(function() { resume k <- mesc; }, msec);
suspend;

}
这个语法更吓人了,并且还是java里不被推荐使用的线程方法名。坦白说我倾向于 Narrative JS。

同Narrative JS一样,jwacs也须要预编译,预编译器是用 LISP 语言编写。眼下也是 Alpha 的版本号。两者的许多其他介绍和比較能够參阅 SitePoint 上的新文章: Eliminating async Javascript callbacks by preprocessing

编写复杂的JavaScript脚本时,有时会有需求希望脚本能停滞指定的一段时间,相似于 java 中的 Thread.sleep 或者 sh 脚本中的 sleep 命令所实现的效果。

众所周知,JavaScript 并沒有提供相似于 Java 的线程控制的功能, 尽管有 setTimeout 和 setInterval 两个方法能够做一些定时运行控制,但并不能满足全部的要求。一直以来,都有非常多人问怎样在JavaScript中实现 sleep/pause/wait ,也确实有些非常蹩脚的解决方式:

最简单也最糟糕的方法就是写一个循环,代码可能例如以下:

function sleep(numberMillis) {

var now = new Date();
var exitTime = now.getTime() + numberMillis;
while (true) {
    now = new Date();
    if (now.getTime() > exitTime)
        return;
}

}
如上的代码事实上并沒有让脚本解释器sleep下来,并且有让CPU迅速上到高负荷的附作用。浏览器甚至会在该段时间内处于假死状态。

其二有聪明人利用IE特殊的对话框实现来曲径通幽,代码可能例如以下:

function sleep(timeout) {

window.showModalDialog("javascript:document.writeln('<script>window.setTimeout(function () { window.close(); }, " + timeout + ");<\/script>');");

}
window.alert("before sleep ..."); sleep(2000); window.alert("after sleep ...");

缺点不用多说,唯独IE支持(IE7由于安全限制也而不能达到目的)。

除上之外,还有利用Applet或者调用Windows Script Host的WScript.Sleep()等等鬼点子,这些都是万不得已的权宜之计。

最终有了更聪明的人,开发出了或许是最佳的方案,先看代码:

function sleep(millis) {

var notifier = NjsRuntime.createNotifier();
setTimeout(notifier, millis);
notifier.wait->();

}
没错,看到 ->() 这种语法,就象刚看到Prototype的 $() 函数一样让我惊为天人。只是直接在浏览器中这段脚本是会报告语法错误的。实际上它们须要经过预编译成client浏览器认可的JavaScript。编译后的脚本例如以下:

function sleep(millis){var njf1 = njen(this,arguments,"millis");nj:while(1) {try{switch(njf1.cp) { case 0:njf1._notifier=NjsRuntime.createNotifier();setTimeout(njf1._notifier,njf1._millis);njf1.cp = 1;njf1._notifier.wait(njf1);return;case 1:break nj; }} catch(ex) { if(!njf1.except(ex,1)) return; }} njf1.pf();}
我看不懂,也不想去看懂了。这些工作全部会由 Narrative JavaScript ———— 一个提供异步堵塞功能的JS扩展帮我们实现。我们仅仅须要编写之前那个怪异的 ->() 语法, 然后通过后台预先静态编译或者前台动态编译后运行就能够实现 sleep 的效果。

Narrative JavaScript 宣称能够让你从头昏眼花的回调函数中解脱出来,编写清楚的Long Running Tasks。眼下还是 alpha 的版本号,在 Example 页面上有一个移动的button的范例。首页上也提供了源代码下载。以我薄弱的基础知识,我仅仅能勉强的看出代码中模拟了状态机的实现,希望有精通算法的朋友能为我们解析。

最后,还是我一直以来的观点: 除非非常必要,否则请保持JavaScript的简单。在JavaScript 能提供原生的线程支持之前,或许我们能够改变设计以避免异步堵塞的应用。

參考文章:

Agile Ajax - Narrative Javascript - Cleaner Code for Long Running Tasks
FAQTs - How do I pause execution in JavaScript?

本文转自博客园知识天地的博客,原文链接:js 中实现sleep函数 如需转载请自行联系原博主。

相关文章
|
12月前
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
431 19
|
JavaScript
JS实现多条件搜索函数
JS封装的多条件搜索
|
JavaScript 前端开发
JavaWeb JavaScript ③ JS的流程控制和函数
通过本文的详细介绍,您可以深入理解JavaScript的流程控制和函数的使用,进而编写出高效、可维护的代码。
318 32
|
JavaScript 前端开发 Java
详解js柯里化原理及用法,探究柯里化在Redux Selector 的场景模拟、构建复杂的数据流管道、优化深度嵌套函数中的精妙应用
柯里化是一种强大的函数式编程技术,它通过将函数分解为单参数形式,实现了灵活性与可复用性的统一。无论是参数复用、延迟执行,还是函数组合,柯里化都为现代编程提供了极大的便利。 从 Redux 的选择器优化到复杂的数据流处理,再到深度嵌套的函数优化,柯里化在实际开发中展现出了非凡的价值。如果你希望编写更简洁、更优雅的代码,柯里化无疑是一个值得深入学习和实践的工具。从简单的实现到复杂的应用,希望这篇博客能为你揭开柯里化的奥秘,助力你的开发之旅! 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一
|
前端开发 JavaScript 开发者
除了 Generator 函数,还有哪些 JavaScript 异步编程解决方案?
【10月更文挑战第30天】开发者可以根据具体的项目情况选择合适的方式来处理异步操作,以实现高效、可读和易于维护的代码。
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。
|
存储 JavaScript 前端开发
JS函数提升 变量提升
【10月更文挑战第6天】函数提升和变量提升是 JavaScript 语言的重要特性,但它们也可能带来一些困惑和潜在的问题。通过深入理解和掌握它们的原理和表现,开发者可以更好地编写和维护 JavaScript 代码,避免因不了解这些机制而导致的错误和不一致。同时,不断提高对执行上下文等相关概念的认识,将有助于提升对 JavaScript 语言的整体理解和运用能力。
|
Web App开发 JavaScript 前端开发
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
453 2
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
346 1
JavaScript中的原型 保姆级文章一文搞懂

热门文章

最新文章