我想在while循环中添加一个delay/sleep:

我是这样试的:

alert('hi');

for(var start = 1; start < 10; start++) {
  setTimeout(function () {
    alert('hello');
  }, 3000);
}

只有第一种情况是正确的:在显示alert('hi')后,它将等待3秒,然后alert('hello')将显示,但随后alert('hello')将不断重复。

我想要的是,在警报('hello')显示3秒后警报('hi'),然后它需要等待3秒的第二次警报('hello'),以此类推。


当前回答

你可以使用RxJS的间隔操作符。Interval每x秒发出一个整数,take指定它发出这些数字的次数。

Rx。可观测的 .interval (1000) (10), .subscribe((x) => console.log(x)) < script src = " https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.lite.min.js " > < /脚本>

其他回答

另一种方法是将超时时间相乘,但请注意,这与睡眠不同。循环之后的代码将立即执行,只有回调函数的执行被延迟。

for (var start = 1; start < 10; start++)
    setTimeout(function () { alert('hello');  }, 3000 * start);

第一个超时设置为3000 * 1,第二个超时设置为3000 * 2,依此类推。

试试这个…

var icount=0;
for (let i in items) {
   icount=icount+1000;
   new beginCount(items[i],icount);
}

function beginCount(item,icount){
  setTimeout(function () {

   new actualFunction(item,icount);

 }, icount);
}

function actualFunction(item,icount){
  //...runs ever 1 second
 console.log(icount);
}

因为ES7有一个更好的方法来等待循环:

// Returns a Promise that resolves after "ms" Milliseconds
const timer = ms => new Promise(res => setTimeout(res, ms))

async function load () { // We need to wrap the loop into an async function for this to work
  for (var i = 0; i < 3; i++) {
    console.log(i);
    await timer(3000); // then the created Promise can be awaited
  }
}

load();

当引擎到达await部分时,它设置一个超时并停止async函数的执行。然后,当超时完成时,继续执行。这是非常有用的,因为你可以延迟(1)嵌套循环,(2)有条件的,(3)嵌套函数:

异步函数任务(i) {// 3 等待计时器(1000); console.log('任务${i}完成! '); } 异步函数main() { 对于(设I = 0;I < 100;I += 10) { For(令j = 0;J < 10;j++) {// 1 如果(j % 2) {// 2 等待任务(i + j); } } } } main (); 函数定时器(ms){返回新的承诺(res => setTimeout(res, ms));}

MDN参考资料

虽然ES7现在被NodeJS和现代浏览器支持,但你可能想用BabelJS编译它,这样它就可以在任何地方运行。

在ES6 (ECMAScript 2015)中,您可以使用生成器和间隔迭代延迟。

生成器(generator)是ECMAScript 6的一个新特性,是可以被替换的函数 顿了顿,接着说。调用genFunc不会执行它。相反,它 返回一个所谓的生成器对象,让我们控制genFunc的 执行。genFunc()最初是挂起在它的开始 的身体。方法genObj.next()继续执行genFunc, 直到下一次丰收。 (探索ES6)

代码示例: Let arr = [1,2,3, 'b']; let genObj = genFunc(); let val = genObj.next(); console.log (val.value); let interval = setInterval(() => { val = genObj.next(); If (val.done) { clearInterval(间隔); }其他{ console.log (val.value); } }, 1000); 函数* genFunc() { For (let item of arr) { 收益项; } }

所以如果你正在使用ES6,这是实现延迟循环的最优雅的方式(在我看来)。

我可能会使用setInterval,像这样:

var period = 1000; // ms
var endTime = 10000;  // ms
var counter = 0;
var sleepyAlert = setInterval(function(){
    alert('Hello');
    if(counter === endTime){
       clearInterval(sleepyAlert);
    }
    counter += period;
}, period);