JavaScript中的sleep()函数是什么？

26 浏览
0 Comments

JavaScript中的sleep()函数是什么？

有没有比下面这个 pausecomp 函数 (来源在此) 更好的方法在 JavaScript 中实现休眠？

function pausecomp(millis)
{
    var date = new Date();
    var curDate = null;
    do { curDate = new Date(); }
    while(curDate-date < millis);
}

这并不是重复的问题 Sleep in JavaScript - delay between actions；我想要在函数中间实现真正的休眠，而不是在一段代码执行之前进行延迟。

admin 更改状态以发布 2023年5月24日
0

2 答案

0 Comments

(请参阅2016年的更新答案)

我认为希望执行某个操作，等待一段时间，然后再执行另一个操作是非常合理的。如果你习惯于编写多线程语言，你可能会想到在线程休眠一段时间后恢复执行。

问题在于JavaScript是单线程的事件模型。虽然在特定情况下，让整个引擎等待几秒钟可能很好，但通常情况下这是一种不好的做法。假设我想在编写自己的函数时使用你的函数，当我调用你的方法时，我的方法会全部冻结。如果JavaScript能够以某种方式保留你的函数执行上下文，在某处存储它，然后将其恢复并继续执行，那么等待就可以发生，但那基本上就是多线程。

因此，你基本上只能按照其他人建议的方式将代码分成多个函数。

你的问题有点虚假，因为没有办法以你想要的方式进行睡眠，也不应该追求你建议的解决方案。

0
0 Comments

2017-2021 更新

自2009年提出这个问题以来，JavaScript 已经显著发展。所有其他的答案现在都已过时或过于复杂。以下是当前的最佳实践：

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

或者作为一行代码：

await new Promise(r => setTimeout(r, 2000));

作为一个函数：

const sleep = ms => new Promise(r => setTimeout(r, ms));

或者在 TypeScript 中：

const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));

使用方法如下：

await sleep();

演示：

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}
async function demo() {
    for (let i = 0; i < 5; i++) {
        console.log(`Waiting ${i} seconds...`);
        await sleep(i * 1000);
    }
    console.log('Done');
}
demo();

请注意：

  1. await 只能在以 async 关键字为前缀的函数中执行，或者在 越来越多的环境 的顶层脚本中执行。
  2. await 仅会暂停当前的 async 函数。这意味着它不会阻塞其余脚本的执行，在绝大多数情况下，这正是您所希望的。如果您确实需要一个阻塞构造，请参见使用 Atomics.wait 的 此答案，但请注意，大多数浏览器不允许在浏览器的主线程上执行它。

两个 JavaScript 的新功能（截至 2017 年）帮助编写此“休眠”函数：

兼容性

  • Promise在Node v0.12+中得到支持（广泛支持浏览器，除了IE）
  • async/await在V8中得到支持并且自Chrome 55（于2016年12月发布）默认启用
    • async/await在2016年10月的Node 7中得到支持
    • async/await也在2016年11月的Firefox Nightly中得到支持

如果由于某种原因您使用的是早于Node 7（在2017年到达生命周期的终点）的版本，或者针对旧浏览器，可以通过Babel（将JavaScript +新功能转换为普通的JavaScript的工具）和transform-async-to-generator插件来使用async/await。

0