如果你写一个这样的睡眠函数

var sleep = function(period, decision, callback){
    var interval = setInterval(function(){
        if (decision()) {
            interval = clearInterval(interval);
            callback();
        }
    }, period);
}

你有一个异步函数可以多次调用，

var xhr = function(url, callback){
    // Make an Ajax request
    // Call a callback when the request fulfils
}

您的项目设置如下：

var ready = false;

function xhr1(){
    xhr(url1, function(){ ready = true;});
}
function xhr2(){
    xhr(url2, function(){ ready = true; });
}
function xhr3(){
    xhr(url3, function(){ ready = true; });
}

然后您可以执行以下操作：

xhr1();
sleep(100, function(){ return done; }, xhr2);
sleep(100, function(){ return done; }, xhr3);
sleep(100, function(){ return done; }, function(){
    // Do more
});

而不是像这样无休止的回调缩进：

xhr(url1, function(){
    xhr2(url2, function(){
        xhr3(url3, function(){
            // Do more
        });
    });
});

首先，应该使用setTimeout和setInterval，因为JavaScript具有回调性质。如果您想使用sleep（），则是控制流或代码架构不正确。

尽管如此，我想我仍然可以帮助实现两个睡眠。

1.我头顶上的假同步跑步：

// A module to do that //dual-license: MIT or WTF [you can use it anyhow and leave my nickname in a comment if you want to]
var _ = (function(){
  var queue = [];
  var play = function(){
    var go = queue.shift();
      if(go) {
        if(go.a) {
          go.f();
          play();
        }
        else
        {
          setTimeout(play, go.t);
        }
      }
  }
  return {
    go:function(f){
      queue.push({a:1, f:f});
    },
    sleep:function(t){
      queue.push({a:0, t:t});
    },
    playback:play
  }
})();

[也可以自动播放]

// Usage

_.go(function(){

  // Your code
  console.log('first');

});

_.sleep(5000);

_.go(function(){

  // Your code
  console.log('next');

});

// This triggers the simulation
_.playback();

2.实际同步运行

有一天，我对它进行了很多思考，我在JavaScript中真正睡觉的唯一想法就是技术。

睡眠函数必须是同步Ajax调用，超时设置为睡眠值。这就是真正睡觉的唯一方法。

这是一种阻塞型睡眠。发现在需要顺序执行的测试活动中更容易遵循。它可以被称为sleep（2000），让线程休眠2秒。

function sleep(ms) {
    const now = Date.now();
    const limit = now + ms;
    let execute = true;
    while (execute) {
        if (limit < Date.now()) {
            execute = false;
        }
    }
    return;
  }

使用三种功能：

调用setInterval启动循环的函数一个函数，它调用clearInterval来停止循环，然后调用setTimeout来休眠，最后在setTimeout内调用作为回调来重新启动循环一个循环，跟踪迭代次数，设置睡眠次数和最大次数，一旦达到睡眠次数就调用睡眠函数，并在达到最大次数后调用clearInterval

var foo＝｛｝；函数main（）{“使用严格”；/*初始化全局状态*/foo.bar=foo.bar ||0；/*初始化计时器*/foo.bop=设置间隔（foo.baz，1000）；}睡眠=功能（计时器）{“使用严格”；clearInterval（计时器）；timer=setTimeout（function（）｛main（）｝，5000）；};foo.baz=函数（）{“使用严格”；/*更新状态*/foo.bar=数字（foo.bar+1）||0；/*日志状态*/console.log（foo.bar）；/*检查状态并在10时停止*/（foo.bar===5）&&睡眠（foo.bop）；（foo.bar==10）&&clearInterval（foo.bop）；};main（）；

工具书类

使用JavaScript开发游戏为什么iOS 8中的滚动事件更改是一件大事Ember.js中的实时轮询系统使用requestAnimationFrame（）驱动动画MDN:JavaScript并发模型和事件循环网格研究：Node.js在JavaScript中超过60fps第2部分：不阻塞单个线程的CPU密集型JavaScript计算

你可以这样做。所有函数都可以继承的休眠方法：

Function.prototype.sleep=函数（延迟，…args）{setTimeout（（）=>this（…args），delay）}console.log.sleep（2000年，“你好，世界！！”）

如果您真的需要等待那么多秒，那么当前接受的使用async/await和setTimeout的解决方案是完美的。然而，如果您将其用于屏幕动画，则应该真正使用requestAnimationFrame（）。此函数的功能与setTimeout非常相似，但回调仅在用户可见动画时调用。这意味着，如果您在网站上运行动画，并且用户切换选项卡，动画将暂停并节省电池寿命。

这里是使用requestAnimationFrame的wait方法的实现。它接收多个帧，并在它们全部通过后解析：

常量动画等待=（帧）=>新承诺（（决心）=>{让framesPassed=0；requestAnimationFrame（函数循环（）{如果（++framesPassed>=帧）返回resolve（）；requestAnimationFrame（循环）；});});//演示用打字机效果const content=document.querySelector（“.content”）；异步函数类型Writer（endText，等待）{content.textContent=“”；for（const letter of endText）{content.textContent+=字母；wait animationWait（等待）；}}typeWriter（“好的。这个简单的打字机效果是requestAnimationFrame的一个例子。”，8）；<p>动画将在下面播放；尝试切换选项卡并查看动画暂停。</p><code class=“content”></code>

阅读有关requestAnimationFrame的更多信息

浏览器支持（IE10+）