js中实现sleep暂停/睡眠功能的多种方式

时间: 2018-07-13阅读: 51929标签: js技巧

由于很多语言都有sleep函数,但是js中没有,下面介绍JavaScript实现类似sleep的多种方式。


1、利用循环

function sleep(d){
  for(var t = Date.now();Date.now() - t <= d;);
}
sleep(5000); //当前方法暂停5秒

优点:简单粗暴,通俗易懂。

缺点:这是最简单粗暴的实现,确实 sleep 了,也确实卡死了,CPU 会飙升,无论你的服务器 CPU 有多么 Niubility。


2、Promise版本  

function sleep(ms) {
  return new Promise(resolve => 
      setTimeout(resolve, ms)
  )
}
sleep(3000).then(()=>{
   //code
})

优点:这种方式实际上是用了 setTimeout,没有形成进程阻塞,不会造成性能和负载问题。

缺点:虽然不像 callback 套那么多层,但仍不怎么美观,而且当我们需要在某过程中需要停止执行(或者在中途返回了错误的值),还必须得层层判断后跳出,非常麻烦,而且这种异步并不是那么彻底,还是看起来别扭。


3、通过generate来实现

function* sleep(ms){
   yield new Promise(function(resolve,reject){
             console.log(111);
             setTimeout(resolve,ms);
        })  
}
sleep(500).next().value.then(()=>{
  console.log(11111)
})

优点:同 Promise 优点,另外代码就变得非常简单干净,没有 then 那么生硬和恶心。

缺点:但不足也很明显,就是每次都要执行 next() 显得很麻烦,虽然有co(第三方包)可以解决,但就多包了一层不好看,错误也必须按co的逻辑来处理不爽。


4、通过 Async/Await 封装

function sleep(ms){
  return new Promise((resolve)=>setTimeout(resolve,ms));
}
async function test(){
  var temple=await sleep(1000);
  console.log(1111)
  return temple
}
test();
//延迟1000ms输出了1111

优点:同 Promise 和 Generator 优点。 Async/Await 可以看做是 Generator 的语法糖,Async 和 Await 相较于 * 和 yield 更加语义,另外各个函数都是扁平的,不会产生多余的嵌套,代码更加清爽易读。

缺点: ES7 语法存在兼容性问题,有 babel 一切兼容性都不是问题


5、使用node-sleep

var sleep = require('sleep');
var n=10;

sleep.sleep(n) //sleep for n seconds
sleep.msleep(n) //sleep for n miliseconds
sleep.usleep(n) //sleep for n microseconds (1 second is 1000000 microseconds)

优点:能够实现更加精细的时间精确度,而且看起来就是真的 sleep 函数,清晰直白。

缺点:缺点需要安装这个模块,这也许算不上什么缺点。

地址:https://github.com/ErikDubbelboer/node-sleep


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/925

关闭

js实现HSL与RGB色彩的相互转换功能

RGB和HSL是两种色彩空间,即:红,绿,蓝和色调,饱和度,亮度,前者适用于机器采样,目前的显示器颜色即由这三种基色构成,而后者更符合人类的直观感觉。这篇文章主要介绍原生js实现HSL与RGB相互转换

UglifyJS3的使用,UglifyJS3中文文档

使用UglifyJS合并/压缩JavaScript ,UglifyJS3与UglifyJS2相比API变动较大,简化较多,文档也增加了不少示例。

js中一些怪异的写法_神奇的JavaScript

JavaScript是一门伟大的语言,作为一门弱类型语言,它拥有非常简洁的语法,庞大的生态系统,灵活性非常强大。js各种神奇的写法,所谓的神奇也就是罕见。下面就开始介绍这些怪异的写法吧。

js中~~和 | 的妙用

~~它代表双非按位取反运算符,如果你想使用比Math.floor()更快的方法,那就是它了。需要注意,对于正数,它向下取整;对于负数,向上取整;非数字取值为0,它具体的表现形式为:

一行能装逼的JavaScript代码

一行能装逼的JavaScript代码,其实靠的是js的类型转化的一些基本原理,本篇就来揭密”sb”是如何炼成的。相信你如果能把这个理清楚了,以后遇到类型转化之类的题目,就可以瞬间秒杀了。

js实现浏览器:加入收藏、设为首页、保存到桌面的方法功能

在一些网页中我们可以常见的“设置为首页”和“ 收藏本站”,以及“保存到桌面”等功能,使用js是如何实现的呢?这里为大家分享下实现方法,完美兼容IE,chrome,ff等浏览器

(a ==1 && a== 2 && a==3) 有可能是 true 吗?

1. 利用松散相等运算符 == 的原理,自定义 toString 和 valueOf 返回对应值2. 利用半宽度韩文等特殊字符,玩“障眼法”,本质上其实并没有做到题设3. 劫持 JS 对象的 getter,不过这种方式对于严格相等 === 同样有效

js判断参数是否为非0整数数字或者整数数字字符串的简单方法(小装逼)

我们来判断一个值是否为数字,可以把它转化为数字,看是否为NaN 然后,再判断是否等于0即可简单的来实现判断了。js判断参数是否为非0整数数字或者整数数字字符串的简单方法

JavaScript 异步调用——从小小题目逐步走进 JavaScript 异步调用

async/await 语法让异步调用写起来像写同步代码,在编写代码的时候,可以避免逻辑跳跃,写起来会更轻松。

不用if撸代码,是件很有趣的事。

试着不用if撸代码,是件很有趣的事,而且,万一你领会了什么是“数据即代码,代码即数据”呢?

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!