Javascript 在双循环中添加延迟

在这段代码（源代码：eloquent javascript）中，我想为这两个循环中的任何一个添加1秒的延迟，但我无法以任何方式进行管理。我想看看如何用setTimeout解决每个循环和两个循环的问题（每个迭代都要一个接一个地执行1秒，谢谢你。我无法从类似的问题/答案中得出这个结果）

let board=”“；
for（设y=0；y<8；y++）{
for（设x=0；x<8；x++）{
如果（（x+y）%2==0）
{board+=“”；}
else{board+=“#”；}
}
线路板+=“\n”；
}
console.log（board）

您可以将生成器与setinterval结合使用，每秒调用

迭代器#next

。因此在下面的示例中，只要想等待1秒，就执行

生成board

函数*循环（）{
让board=“”；
for（设y=0；y<8；y++）{
for（设x=0；x<8；x++）{
电路板+=（x+y）%2？#“：”；
屈服板；
}
线路板+=“\n”；
}
返回板；
}
var迭代器=循环（）；
（职能iife（）{
setTimeout（函数（）{
var result=iterator.next（）；
document.querySelector（“#result”）.textContent=result.value；
如果（！result.done）iLife（）；
else console.log（“完成”）；
}, 1000);
})（）；

#结果{
空白：预处理；
}
#结果：之前，
#结果：：之后{
内容：‘’”；
}

---

您可以将生成器与setinterval结合使用，每秒调用

迭代器#next

。因此在下面的示例中，只要在需要等待1秒时执行

屈服板

函数*循环（）{
让board=“”；
for（设y=0；y<8；y++）{
for（设x=0；x<8；x++）{
电路板+=（x+y）%2？#“：”；
屈服板；
}
线路板+=“\n”；
}
返回板；
}
var迭代器=循环（）；
（职能iife（）{
setTimeout（函数（）{
var result=iterator.next（）；
document.querySelector（“#result”）.textContent=result.value；
如果（！result.done）iLife（）；
else console.log（“完成”）；
}, 1000);
})（）；

#结果{
空白：预处理；
}
#结果：之前，
#结果：：之后{
内容：‘’”；
}

---

我们可以通过的一个非常简单的实现来分割您的显示和处理逻辑。我们基本上需要这些东西

• 消息队列或消息通道。在这种情况下，我们可以使用数组-没有理由不使用，因为它是实现它最简单的方法
• 发布者将向队列中添加消息。在这种情况下，您执行的算法是每次添加

  板
  

• 将对数组中的每个条目执行操作的订阅服务器。在这种情况下，只需将其打印到控制台即可
• 消息代理-这通常是将消息发送给订阅者的部分。在这里，我们可以使用一个简单的方法，定期轮询消息队列，如果有消息，则转发它们

一个商业发布-订阅系统可能会有很多麻烦-多个队列/通道、消息过滤、主题、消费事件的存储等等。在这种情况下，我们并不真正需要所有这些，但下面是一个关于发布子系统如何工作的示例，而不是一个完整的实现。StiLH，对于这个问题，我们不一定需要所有这些。下面是一个基本的实现：

//消息队列
让队列=[]；
//我们的消息代理
设定间隔(
() => {
if（queue.length！==0）{
const frame=queue.shift（）；
//我们的订户
打印（框架）；
}
},
1000
);
//我们的出版商
函数计算（）{
让board=“”；
for（设y=0；y<8；y++）{
for（设x=0；x<8；x++）{
如果（（x+y）%2==0）
{board+=“”；}
else{board+=“#”；}
}
线路板+=“\n”；
queue.push（board）；//发布操作
}
}
计算（）；
//只需打印到控制台
功能打印（帧）{
console.log（框架）
}

我们可以通过的一个非常简单的实现来分割您的显示和处理逻辑。我们基本上需要这些东西

• 消息队列或消息通道。在这种情况下，我们可以使用数组-没有理由不使用，因为它是实现它最简单的方法
• 发布者将向队列中添加消息。在这种情况下，您执行的算法是每次添加

  板
  

• 将对数组中的每个条目执行操作的订阅服务器。在这种情况下，只需将其打印到控制台即可
• 消息代理-这通常是将消息发送给订阅者的部分。在这里，我们可以使用一个简单的方法，定期轮询消息队列，如果有消息，则转发它们

一个商业发布-订阅系统可能会有很多麻烦-多个队列/通道、消息过滤、主题、消费事件的存储等等。在这种情况下，我们并不真正需要所有这些，但下面是一个关于发布子系统如何工作的示例，而不是一个完整的实现。StiLH，对于这个问题，我们不一定需要所有这些。下面是一个基本的实现：

//消息队列
让队列=[]；
//我们的消息代理
设定间隔(
() => {
if（queue.length！==0）{
const frame=queue.shift（）；
//我们的订户
打印（框架）；
}
},
1000
);
//我们的出版商
函数计算（）{
让board=“”；
for（设y=0；y<8；y++）{
for（设x=0；x<8；x++）{
如果（（x+y）%2==0）
{board+=“”；}
else{board+=“#”；}
}
线路板+=“\n”；
queue.push（board）；//发布操作
}
}
计算（）；
//只需打印到控制台
功能打印（帧）{
console.log（框架）
}

var count=0；
/*
参数：
数组：[]
fnc：功能（功能形式的业务逻辑-，您希望执行的内容）
延迟：毫秒
*/
函数延迟循环（数组，
var count = 0;
/*
Parameters:
    array: []
    fnc: function (the business logic in form of function-,what you want to execute)
    delay: milisecond    
*/
function delayLoop(array,fnc,delay){
    if(!array || array.legth == 0)return false;
    setTimeout(function(data){ 
        var data = array[count++];
        fnc && fnc(data);
        //recursion...
        if(count < array.length)
            delayLoop(array,fnc,delay);
        else count = 0;     
    },delay);
}