JS实现sleep，普通版+promise+async/await

牛小小小婷～

已于 2022-09-29 07:40:31 修改

阅读量612

点赞数

分类专栏： # JavaScript 文章标签： javascript 前端开发语言

于 2022-07-08 18:03:33 首次发布

本文链接：https://blog.csdn.net/hannah2233/article/details/125595665

版权

JavaScript 专栏收录该内容

27 篇文章 1 订阅

订阅专栏

本文探讨了两种在JavaScript中实现异步sleep函数的方法：基于Promise和基于async/await。Promise版本利用setTimeout避免了进程阻塞，但会导致回调地狱。而async/await提供更简洁的代码结构，易于理解和维护。然而，它仍然基于Promise，并可能产生类似的问题。文章对比了两者的优缺点，并提供了示例代码进行说明。

摘要由CSDN通过智能技术生成

1-1 普通版

function sleep() {
	var start = new Date()
	while(new Date() - start <= sleepTime) {}
	var t1 = new Date()
	sleep(3000)
	var t2 = new Date()
	console.log(t2 - t1)
}

1-2JS实现sleep，用promise

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

const t1 = new Date();
sleep(3000).then(()=>{
	const t2 = new Date()
	console.log(t2-t1)
})

优点：使用了setTimeout，没有形成进程阻塞，不会造成性能和负载问题
缺点：变成纵向then回调，当我们需要在某过程中停止执行（或者在中途返回错误的值），必须得层层判断后跳出，这种异步不是那么彻底

2-3 async/await版本

function sleep (delay) {
	return new Promise(resolve => {
		setTimeout(resolve,delay)
	})
}

(async function test() {
	const t1 = new Date()
	await sleep(3000)
	const t2 = new Date();
	log(t2 - t1)
}())