当前位置:首页 > JavaScript

js实现睡眠

2026-03-14 13:26:38JavaScript

使用 setTimeoutPromise 实现睡眠

在 JavaScript 中,可以通过 setTimeout 结合 Promise 实现睡眠功能。这种方法利用了异步编程的特性,不会阻塞主线程。

js实现睡眠

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

// 使用示例
async function demo() {
  console.log('开始');
  await sleep(2000); // 等待2秒
  console.log('结束');
}
demo();

使用 Atomics.wait 实现同步睡眠

对于需要同步睡眠的场景(通常不建议在主线程使用),可以使用 Atomics.wait。这种方法会真正阻塞线程,适用于 Worker 线程环境。

js实现睡眠

function syncSleep(ms) {
  const sharedArrayBuffer = new SharedArrayBuffer(4);
  const view = new Int32Array(sharedArrayBuffer);
  Atomics.wait(view, 0, 0, ms);
}

// 使用示例(注意:在主线程使用会冻结页面)
console.log('开始');
syncSleep(2000); // 同步等待2秒
console.log('结束');

使用 async/await 简化异步流程

结合 async/await 语法可以更清晰地组织需要睡眠的异步代码逻辑。

async function processWithSleep() {
  console.log('步骤1');
  await sleep(1000);

  console.log('步骤2');
  await sleep(1500);

  console.log('完成');
}
processWithSleep();

注意事项

  • 浏览器环境中的 setTimeout 最小延迟通常为 4ms(即使设置为 0ms)
  • Node.js 环境从版本 16 开始支持 timers/promises 模块的 setTimeout 直接返回 Promise
  • 同步睡眠会阻塞事件循环,网页中使用会导致界面冻结
  • Worker 线程中可以使用更精确的 performance.now() 配合循环实现忙等待(不推荐)

Node.js 专用方法

Node.js 15+ 版本可以直接使用 timers/promises 模块:

import { setTimeout } from 'timers/promises';

async function nodeSleep() {
  console.log('开始');
  await setTimeout(2000);
  console.log('结束');
}
nodeSleep();

标签: 睡眠js
分享给朋友:

相关文章

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('image…

js实现百叶窗

js实现百叶窗

使用CSS和JavaScript实现百叶窗效果 通过CSS动画和JavaScript事件监听可以实现百叶窗效果。核心思路是将内容区域分割为多个条状元素,通过控制它们的展开/折叠状态来模拟百叶窗。…

js实现祖玛

js实现祖玛

实现祖玛游戏的核心思路 祖玛游戏的核心玩法是发射彩色珠子,形成三个或以上相同颜色的珠子即可消除。以下是使用JavaScript实现的基本框架。 游戏初始化 创建画布并初始化游戏状态: const…

js实现防洪

js实现防洪

防抖(Debounce)实现 防抖的核心思想是在事件触发后延迟执行回调函数,若在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口调整等场景。 function debounce(f…

js实现自举

js实现自举

实现 JavaScript 自举的方法 JavaScript 自举(Bootstrap)通常指通过 JavaScript 动态加载自身或依赖的脚本,实现运行时环境的初始化或扩展。以下是几种常见实现方式…

vue实现js休眠

vue实现js休眠

实现 JavaScript 休眠的方法 在 Vue 中实现 JavaScript 休眠(延迟执行)可以通过以下方式实现。由于 JavaScript 本身没有内置的 sleep 函数,通常使用 Prom…