当前位置:首页 > JavaScript

js 实现sleep

2026-02-01 03:00:59JavaScript

在JavaScript中实现sleep功能可以通过多种方式实现,以下是几种常见的方法:

使用setTimeoutPromise

通过结合PromisesetTimeout,可以创建一个异步的sleep函数:

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

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

使用async/await简化调用

async/await语法可以更清晰地处理异步等待:

(async () => {
  console.log('等待开始');
  await new Promise(resolve => setTimeout(resolve, 3000));
  console.log('等待结束');
})();

同步阻塞方式(不推荐)

如果需要同步阻塞(通常不推荐,因为会阻塞主线程),可以使用循环或Atomics.wait(仅限于Node.js或特定环境):

function sleepSync(ms) {
  const start = Date.now();
  while (Date.now() - start < ms) {}
}
console.log('开始阻塞');
sleepSync(3000); // 阻塞3秒
console.log('阻塞结束');

使用setTimeout回调(传统方式)

传统回调方式适用于不支持Promise的环境:

js 实现sleep

function sleepWithCallback(ms, callback) {
  setTimeout(callback, ms);
}

sleepWithCallback(2000, () => {
  console.log('回调执行');
});

注意事项

  • 异步sleep(如Promise)不会阻塞主线程,适合大多数场景。
  • 同步sleep会冻结整个页面,仅用于特殊需求或测试环境。
  • Node.js中可以使用util.promisify结合setTimeout进一步简化代码。

标签: jssleep
分享给朋友:

相关文章

jquery js

jquery js

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够更高…

js实现百叶窗

js实现百叶窗

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

js验证码的实现

js验证码的实现

验证码的基本实现原理 验证码(CAPTCHA)的核心目标是区分人类用户和自动化程序。JavaScript可用于生成或验证客户端验证码,但需注意纯前端验证可能被绕过,通常需结合后端验证。 纯前端验证码…

js实现复制功能实现

js实现复制功能实现

使用document.execCommand方法(传统方式,已逐渐被弃用) 传统方式通过document.execCommand('copy')实现复制功能,需先选中文本。以下是一个完整示例: fu…

js 实现文件上传

js 实现文件上传

文件上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现文件上传功能。以下是一个基础示例: <input ty…

js实现放大缩小

js实现放大缩小

使用 CSS transform 实现缩放 通过修改元素的 transform 属性实现平滑缩放效果。CSS 的 scale() 函数可以轻松调整元素大小。 const element = docu…