我想在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')，以此类推。
当前回答
在ES6中，你可以这样做:
对于(设I = 0;I <= 10;我+ +){ setTimeout(函数(){ console.log(我); },我* 3000) }
在ES5中，你可以这样做:
For (var I = 0;I <= 10;我+ +){ (函数(i) { setTimeout(函数(){ console.log(我); },我* 3000) }) (); ｝
原因是，let允许您声明限制在块语句或使用它的表达式范围内的变量，而不像var关键字那样全局定义变量，或局部定义整个函数，而不考虑块范围。
其他回答
这个脚本适用于大多数情况
function timer(start) {
setTimeout(function () { //The timer
alert('hello');
}, start*3000); //needs the "start*" or else all the timers will run at 3000ms
}
for(var start = 1; start < 10; start++) {
timer(start);
}
你这样做:
console.log(“嗨”) Let start = 1 setTimeout(函数(){ let interval = setInterval(函数(){ if(start == 10) clearInterval(interval) 开始+ + console.log(“你好”) }, 3000) }, 3000) < script src = " https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js " > < /脚本>
我认为你需要这样的东西:
var TimedQueue = function(defaultDelay){
this.queue = [];
this.index = 0;
this.defaultDelay = defaultDelay || 3000;
};
TimedQueue.prototype = {
add: function(fn, delay){
this.queue.push({
fn: fn,
delay: delay
});
},
run: function(index){
(index || index === 0) && (this.index = index);
this.next();
},
next: function(){
var self = this
, i = this.index++
, at = this.queue[i]
, next = this.queue[this.index]
if(!at) return;
at.fn();
next && setTimeout(function(){
self.next();
}, next.delay||this.defaultDelay);
},
reset: function(){
this.index = 0;
}
}
测试代码:
var now = +new Date();
var x = new TimedQueue(2000);
x.add(function(){
console.log('hey');
console.log(+new Date() - now);
});
x.add(function(){
console.log('ho');
console.log(+new Date() - now);
}, 3000);
x.add(function(){
console.log('bye');
console.log(+new Date() - now);
});
x.run();
注意:使用警报暂停javascript执行，直到你关闭警报。 它的代码可能比您要求的要多，但这是一个健壮的可重用解决方案。
这是可行的
for (var i = 0; i < 10; i++) {
(function(i) {
setTimeout(function() { console.log(i); }, 100 * i);
})(i);
}
试试这把小提琴:https://jsfiddle.net/wgdx8zqq/
您可以创建一个承诺setTimeout的睡眠函数。这使您可以使用async/await来编写代码，而无需回调和熟悉的for循环控制流。
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms)); (async () => { 对于(设I = 0;I < 10;我+ +){ console.log(我); 等待睡眠(1000); ｝ console.log(“完成”); }) ();
在Node中，你可以使用计时器/承诺来避免承诺步骤(如果旧版本的Node不支持该功能，上面的代码也可以工作):
const {setTimeout: sleep} = require("timers/promises");
// same code as above
无论如何，由于JS是单线程的，超时是异步的是一件好事。如果不这样做，浏览器就没有机会重新绘制UI，从而导致用户的界面冻结。
