Как добавить задержку в цикл JavaScript?
Похоже, вы подключаетесь к базе данных из другого контейнера Docker. Когда вы делаете это, открытый / переадресованный порт не используется, поэтому вы все равно должны использовать 3306 оттуда. Вы будете использовать 3307 только при подключении к нему снаружи Docker.
6 ответов
Функция setTimeout() неблокирует и немедленно возвращает значение. Поэтому ваш цикл будет повторяться очень быстро, и он инициирует 3-секундные триггеры тайм-аута один за другим в быстрой последовательности. Именно поэтому ваши первые оповещения выскакивают через 3 секунды, а все остальные следуют подряд без задержек.
Вместо этого вы можете использовать что-то вроде этого:
var i = 1; // set your counter to 1
function myLoop () { // create a loop function
setTimeout(function () { // call a 3s setTimeout when the loop is called
alert('hello'); // your code here
i++; // increment the counter
if (i < 10) { // if the counter < 10, call the loop function
myLoop(); // .. again which will trigger another
} // .. setTimeout()
}, 3000)
}
myLoop(); // start the loop
Вы также можете упорядочить это, используя функцию с автоматическим вызовом, передавая количество итераций в качестве аргумента:
(function myLoop (i) {
setTimeout(function () {
alert('hello'); // your code here
if (--i) myLoop(i); // decrement i and call myLoop again if i > 0
}, 3000)
})(10); // pass the number of iterations as an argument
Вы делаете это:
alert('hi')
let start = 1
setTimeout(function(){
let interval = setInterval(function(){
if(start == 10) clearInterval(interval)
start++
alert('hello')
}, 3000)
}, 3000)<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> let counter =1;
for(let item in items) {
counter++;
setTimeout(()=>{
//your code
},counter*5000); //5Sec delay between each iteration
}
Еще один способ — умножить время до тайм-аута, но учтите, что это не похоже на сон. Код после цикла будет выполняться сразу, откладывается только выполнение callback-функции.
for (var start = 1; start < 10; start++)
setTimeout(function () { alert('hello'); }, 3000 * start);
Первый тайм-аут будет установлен на 3000 * 1, второй — на 3000 * 2 и так далее.
Попробуйте что-то вроде этого:
var i = 0, howManyTimes = 10;
function f() {
alert( "hi" );
i++;
if( i < howManyTimes ){
setTimeout( f, 3000 );
}
}
f();
Я думаю, вам нужно что-то вроде этого:
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 до тех пор, пока вы не закроете оповещение. Это может быть больше кода, чем вы просили, но это надежное решение для повторного использования.