QQ咨询不加好友发不了信息,咨询前先加好友! → QQ:820896380 ×

前端使用javascript如何进行sleep?

  前端使用javascript如何进行sleep?很多语言中都有sleep(),delay()等方法,它能让我们的程序不急着去执行下一步操作,而是延迟、等待一段时间。开发实践中经常会遇到需要这样的需求,比如等待几分钟再去检查某一事件是否发生。JavaScript里有setTimeout()方法来实现设定一段时间后执行...

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

前端使用javascript如何进行sleep? (https://www.wpmee.com/) javascript教程 第1张

  ES6中我们可以借助 Promise对setTimeout函数进行改良,这样就能实现我们想要的sleep()函数的效果了,下面就是把setTimeout()封装在一个Promise中的示例。

async function sleep() { let s = new Date().getTime(); console.log('start...',s); await sleep_inner(1000); let e = new Date().getTime() console.log('end!',e," diff(ms)",e-s);}function sleep_inner(ms) { return new Promise(resolve => setTimeout(resolve, ms));}sleep();

  运行结果

前端使用javascript如何进行sleep? (https://www.wpmee.com/) javascript教程 第2张

  运行这段代码你会发现代码被阻塞了1秒钟,而且这种写法很优雅,就像其它编程语言里的延迟、等待函数。Promise API使我们避免传入回调函数,我们在实现中还使用了ES6中的箭头(arrow)函数。

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

给TA打赏
共{{data.count}}人
人已打赏
wordpress教程

wordpress贷款抵押信用卡公司营销型网站主题模板推荐

2023-2-16 23:52:44

wordpress教程

wordpress五金工具类营销型网站主题模板推荐

2023-2-16 23:52:49

个人中心
购物车
优惠劵
有新私信 私信列表
搜索