当前位置：首页 > JavaScript

js实现sleep

2026-01-31 19:22:55JavaScript

实现 sleep 函数的几种方法

在 JavaScript 中，由于语言本身没有内置的 sleep 函数，但可以通过多种方式模拟实现类似功能。

使用 setTimeout 和回调

通过 setTimeout 和回调函数实现延迟执行：

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

// 使用示例
console.log('开始');
sleep(2000, () => {
    console.log('2秒后执行');
});

使用 Promise 和 async/await

利用 Promise 和 async/await 语法实现更优雅的 sleep 功能：

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

// 使用示例
async function demo() {
    console.log('开始');
    await sleep(2000);
    console.log('2秒后执行');
}
demo();

使用生成器函数

通过生成器函数和 yield 实现类似协程的效果：

function* sleepGenerator(ms) {
    yield new Promise(resolve => setTimeout(resolve, ms));
}

// 使用示例
const sleep = sleepGenerator(2000);
sleep.next().value.then(() => {
    console.log('2秒后执行');
});
console.log('开始');

使用 Atomics.wait

在 Node.js 环境中，可以使用 Atomics API 实现真正的阻塞：

function sleep(ms) {
    const sharedArray = new SharedArrayBuffer(4);
    const sharedArrayView = new Int32Array(sharedArray);
    Atomics.wait(sharedArrayView, 0, 0, ms);
}

// 使用示例
console.log('开始');
sleep(2000);
console.log('2秒后执行');

使用 busy-waiting（不推荐）

通过循环检查时间实现的 busy-waiting，会阻塞主线程：

function sleep(ms) {
    const start = Date.now();
    while (Date.now() - start < ms) {}
}

// 使用示例
console.log('开始');
sleep(2000);
console.log('2秒后执行');

注意：最后两种方法会阻塞主线程，通常不建议在前端使用。推荐使用 Promise 和 async/await 的方式，既清晰又不会阻塞 UI 线程。

js实现sleep