温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

javascript中sleep的使用方法

发布时间:2020-06-19 11:20:28 来源:亿速云 阅读:189 作者:Leah 栏目:web开发

这期内容当中小编将会给大家带来有关javascript中sleep的使用方法,以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

很多编程语言里都有sleep()delay()等方法,它能让我们的程序不那么着急的去执行下一步操作,而是延迟、等待一段时间。软件开发中经常会遇到需要这样的函数,比如等待几分钟去检查某一事件是否发生。JavaScript里有setTimeout()方法来实现设定一段时间后执行某个任务,但写法很丑陋,需要提供回调函数:

setTimeout(function(){ alert("Hello"); }, 3000);

JavaScript Promise API是新出现了一个API,借助 Promise,我们可以对setTimeout函数进行改良,下面就是把setTimeout()封装成一个返回Promise的sleep()函数。

// https://zeit.co/blog/async-and-await
function sleep (time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}

// 用法
sleep(500).then(() => {
    // 这里写sleep之后需要去做的事情
})

你会发现,这种写法很优雅,很像其它编程语言里的延迟、等待函数。Promise API使我们避免传入回调函数,我们在实现中还使用了ES6中的箭头(arrow)函数。

这里需要提到的一个问题是,这个sleep()在执行的时候是“block”程序的继续执行的。它不是同步的。如果想让它同步执行,不妨碍执行之后的代码,我们可以使用 async/await 关键字。

(async function() {
  console.log('Do some thing, ' + new Date());
  await sleep(3000);
  console.log('Do other things, ' + new Date());
})();

执行结果:

Do some thing, Mon Feb 23 2015 21:52:11 GMT+0800 (CST)  
Do other things, Mon Feb 23 2015 21:52:14 GMT+0800 (CST)

你会发现,这一次,sleep()并没有阻碍第二个console的执行。

async/await 是ES7中的语法,目前还是处于试验阶段。那现在想用这个 async/await 特性怎么办?可以尝试 google 的一个 JavaScript 预编译器 traceur,可以将高版本的 JavaScript 编译为 ES5 代码,已经实验性的支持了 async/await (需要使用 –experimental 来指定开启)。

上文描述的就是javascript中sleep的使用方法,具体使用情况还需要大家自己动手实验使用过才能领会。如果想了解更多相关内容,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI