网络知识
javascript 睡眠
2026-04-02 15:47  点击:0

Javascript 睡眠是一项控制执行时间的技术。在代码中,你可以使用 Javascript 睡眠指令来延迟执行某个操作或在一段时间内执行一项操作。

以延迟执行操作为例,假设你想在10秒钟后,使用 Javascript 实现页面弹出一个提示框。可以使用以下代码实现:

setTimeout(function(){alert("10秒钟到了!");}, 10000);

该代码段通过 setTimeout() 函数,在10秒钟后弹出一个提示框。其中,函数的第一个参数是要执行的操作,第二个参数是要等待的时间,以毫秒为单位。

另一个常见的应用场景是要在一定时间段内批量处理多个任务。例如,在一个时间段内,你想创建一个定时器,然后每两秒向服务器发送一次数据。可以使用以下代码实现:

function sendData() {// 发送数据}var intervalID = setInterval(sendData, 2000);setTimeout(function() {clearInterval(intervalID);}, 10000);

该代码段使用 setInterval() 函数创建一个定时器,隔两秒发送一次数据。同时,并使用 setTimeout() 函数设置了一个计时器,在10秒钟后关闭定时器。

需要注意的是,Javascript 睡眠指令并没有阻塞线程,也就是说,Javascript 还可以执行其他操作。因此,在使用 Javascript 睡眠指令时,仍需留意代码的执行顺序。

另外,现代浏览器提供了更高效、更多样化的 Javascript 睡眠方案,如:Web Worker、Promise、Async/Await 等。

Web Worker 是 HTML5 引入的,“工作线程”的一种实现,用于在后台运行 Javascript 代码。在 Web Worker 里使用 Javascript 睡眠指令时,并不会阻塞主线程,提高了应用程序的性能。

Promise 是 ES6 引入的,用于处理异步代码和防止回调深度嵌套。Promise 中的 setTimeout() 可以用来延迟异步操作的执行。例如:

function sleep(ms) {return new Promise(resolve =>setTimeout(resolve, ms));}async function sometask() {await sleep(3000);console.log("三秒钟后打印");}sometask();console.log("先打印");

代码段中使用 Promsie 实现了 Javascript 睡眠。sometask() 函数等待3秒钟,然后才会打印,而在此期间主线程并不会被阻塞。因此,先打印的是“先打印”。

Async/Await 是 ES7 引入的一项异步编程新特性,用于简化 Promise 的操作。例如:

function sleep(ms) {return new Promise(resolve =>setTimeout(resolve, ms));}async function sometask() {await sleep(3000);console.log("三秒钟后打印");}(async () =>{await sometask();console.log("又过了2秒钟");await sleep(2000);console.log("又过了2秒钟");})();

代码段中,使用 Async/Await 重构了上述示例中的代码,并增加了更多的 Javascript 睡眠操作。sometask() 函数等待3秒种后才会打印,然后,“又过了2秒钟”和“又过了2秒钟”分别会在间隔2秒钟后打印。Async/Await 的灵活性,让我们可以更好地控制 Javascript 睡眠的效果。