我想在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')，以此类推。
当前回答
我可能会使用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);
其他回答
var startIndex = 0; Var数据= [1,2,3]; Var超时= 1000; 函数functionToRun(i, length) { 警报(数据[我]); ｝ (函数forWithDelay(i, length, fn, delay) { setTimeout(函数(){ fn(我、长度); 我+ +; If (i < length) { forWithDelay(i, length, fn, delay); ｝ },延迟); }) (startIndex数据。length, functionToRun, timeout);
Daniel Vassallo回答的修改版本，将变量提取为参数，使函数更具可重用性:
首先让我们定义一些基本变量:
var startIndex = 0;
var data = [1, 2, 3];
var timeout = 3000;
接下来，您应该定义要运行的函数。这将传递i，循环的当前索引和循环的长度，以防你需要它:
function functionToRun(i, length) {
alert(data[i]);
}
Self-executing版本
(function forWithDelay(i, length, fn, delay) {
setTimeout(function () {
fn(i, length);
i++;
if (i < length) {
forWithDelay(i, length, fn, delay);
}
}, delay);
})(startIndex, data.length, functionToRun, timeout);
功能版
function forWithDelay(i, length, fn, delay) {
setTimeout(function () {
fn(i, length);
i++;
if (i < length) {
forWithDelay(i, length, fn, delay);
}
}, delay);
}
forWithDelay(startIndex, data.length, functionToRun, timeout); // Lets run it
在我看来，在循环中添加延迟的最简单和最优雅的方法是这样的:
names = ['John', 'Ana', 'Mary'];
names.forEach((name, i) => {
setTimeout(() => {
console.log(name);
}, i * 1000); // one sec interval
});
const autoPlayer = (arr = [1, 2, 3, 4, 5]) => {
// Base case:
if (arr.length < 1) return
// Remove the first element from the array.
const item = arr.shift()
// Set timout
setTimeout(() => {
console.log('Hello, world!', item) // Visualisation.
autoPlayer() // Call function again.
}, 1000) // Iterate every second.
}
Hey, I know this post is very old, but this code "loops" and adds a delay to it using a recursive method. I don't think you can 'actually' delay a loop itself from iterating based on reading various comments from other people. Maybe this can help someone out! Basically the function accepts an array (in this example). On each iteration the setTimeout Javascript method is called. The function calls itself again indefinitely when the timer of the setTimeout function expires, but on each call the array becomes smaller until it reaches the base-case. I hope this can help anyone else out.
除了10年前接受的答案之外，使用更现代的Javascript，可以使用async/await/Promise()或生成器函数来实现正确的行为。(其他答案中建议的错误行为是设置一系列3秒警报，而不管“接受”警报()-或完成手头的任务)
使用异步/等待/承诺(): alert('嗨'); (async () => { For (let start = 1;起始值< 10;开始+ +){ 等待新的承诺(resolve => setTimeout(() => { alert('你好'); 解决(); }, 3000)); ｝ }) ();
使用生成器函数:
警报（“嗨”）; 让函子; （func = （function*（） { for（let start = 1， start < 10， start++） { yield setTimeout（（） => { 警报（“你好”）; func.next（）; }, 3000); } }）（））.next（）;
我用蓝鸟的承诺。延时和递归。
函数 myLoop（i） { 返回承诺延迟（1000） .then（function（） { 如果 （i > 0） { 警报（“你好”）; 返回 myLoop（i -= 1）; } }); } 我的循环（3）; <script src=“//cdnjs.cloudflare.com/ajax/libs/bluebird/2.9.4/bluebird.min.js”></script>
