下面是JavaScript模拟sleep的两种实现方式的详细攻略。
下面是JavaScript模拟sleep的两种实现方式的详细攻略。
方式一:使用Promise对象
- 定义async函数:
async function sleep(duration) {
return new Promise(resolve => setTimeout(resolve, duration))
}
- 将需要延迟执行的代码放在async函数中:
async function doSomething() {
console.log('start to do something...')
await sleep(2000)
console.log('after sleep 2 seconds...')
}
在上述代码中,doSomething
函数包含一个需要延迟执行2秒的代码,await sleep(2000)
代码使用await
关键字调用Promise对象的resolve
函数来模拟实现sleep。
- 调用async函数:
doSomething()
运行上述代码,可以看到控制台输出:
方式二:使用setTimeout函数进行递归调用
- 定义sleep函数:
function sleep(timeout) {
return new Promise(resolve => {
setTimeout(resolve, timeout);
})
}
- 定义延迟执行的代码块:
function doSomething() {
console.log('start to do something...')
sleep(2000).then(() => {
console.log('after sleep 2 seconds...')
});
}
这里也是需要延迟执行的代码块,其中调用了sleep
函数来实现sleep操作。
- 调用执行代码块的函数:
doSomething();
运行上述代码,可以看到控制台输出:
总结:
以上便是两种JavaScript模拟sleep的方式。使用Promise对象可以简化代码结构,避免了回调函数嵌套;而通过setTimeout递归调用实现的方式,则更为适用于一些特殊情况,例如需要实现循环执行某个代码块并且需要sleep功能的操作。
织梦狗教程
本文标题为:javascript里模拟sleep(两种实现方式)


基础教程推荐
猜你喜欢
- ajax实现省市三级联动效果 2023-02-22
- vue项目中使用 vant 组件无法修改css样式 2023-10-08
- JS中不应该使用箭头函数的四种情况详解 2022-08-30
- springboot+vue+element项目开发(持续更新) 2023-10-08
- html+css实现环绕倒影加载特效 2022-09-21
- 小程序实现Token生成与验证 2023-08-11
- ajax请求后台得到json数据后动态生成树形下拉框的方法 2023-02-22
- 【Layui】当Layui数据表格和Layui下拉框组合时发生的问题 2022-12-17
- HTML表格布局实际使用详解,是HTML入门学习中的基础知识 2023-10-27
- 快速获取Ajax通信对象的方法 2023-02-01