您的位置:首页 > Web前端 > JavaScript

JavaScript 实现Sleep方法(多个setTimeout同步执行)

2021-06-10 11:33 591 查看

前言

JavaScript是单线程的,如果所有操作都是同步,必将线程堵塞,页面失去响应。因此JavaScript采用了事件驱动机制,在单线程模型下,使用异步回调函数的方式来实现非阻塞的IO操作。因此也就出现了多个setTimeout存在时,不能达到理想的效果。那么在JavaScript中实现其他语言中Sleep的效果呢?

解决办法

首先借助Promise对setTimeout函数进行改良,实现一个返回Promise的Sleep函数。

function Sleep (time) {
return new Promise((resolve) => setTimeout(resolve, time));
}
// 用法
Sleep(5000).then(() => {
//Do some thing
})

这里用到了ES6中的箭头(arrow)函数,但是这里不是同步的,我们需要借助 async/await 关键字。

//引用JQuery
$(async function() {
console.log('Do some thing, ' + new Date());
await Sleep(5000);
console.log('Do some thing, ' + new Date());
});

function Sleep (time) {
return new Promise((resolve) => setTimeout(resolve, time));
}

借助 async/await 关键字,我们就实现了类似于其他语言中的Sleep函数。

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: