Javascript 使页面循环显示10秒

我正在用Node JS构建一个猜测游戏。在后端收集了一些数据后，我将其发送到前端，游戏开始。数据包含所有10个关卡，因此游戏可以在单个页面上运行。每一关持续10秒。时间结束后，将用户选择发送到服务器，并返回结果。显示答案，然后将内容更改为“下一级”（使用大数据对象中的内容，因此无需刷新）

我遇到了一些问题，10个级别每次运行10秒（或~12秒，延迟显示结果）

这不能在某些类型的循环中完成，因为每个级别的所有

等待将同时运行。例如：

function timeout(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

for (let i = 0; i < 10; i++) {
    displayPage(i);
    await timeout(10000);
    const result = await $.post(...) // gets results
    displayResults(result);
    await timeout(2000);
}

这似乎效率不高，我认为有更好的方法来做到这一点，但我不确定如何做到。
如有任何建议，将不胜感激。谢谢
 假设第一个选项包装在一个异步函数中，那么它似乎可以工作：


功能超时（毫秒）{
返回新承诺（resolve=>setTimeout（resolve，ms））；
}
const testFunc=async（）=>{
for（设i=0；i<10；i++）{
日志（'page'，i+1'，-问题'）
等待超时（3000）；
console.log（'page'，i+1'，-answer'）
等待超时（1000）；
}
}
testFunc（）
使用大约1000ms的setInterval来创建工作进程，并添加一个状态机来切换播放（10s）和等待（2s）。您需要一个过程来对服务器进行post调用，并需要一个对象来保存数据（级别和内容）

例如：

setInterval(funcWorker,1000,s_gameObj);



 function funcWorker(f_context){
    var l_dateNow = new Date();
    if(f_context.is_playing){
       var l_elapsed = l_dateNow.getTime() - f_context.dateLevelStart.getTime();
       if(l_elapsed.totalSeconds() >= f_context.LEVEL_TIME){

           f_context.end_level();
       }
    }else if(f_context.is_waiting_user){
       //same check as above but on the waiting start 
        ....
         f_context.next_level();


    }else if(f_context.is_waiting_server){
       //do whatever
    }
}

end_level（）应该在context（game）对象中设置状态标志，以发送和发送到服务器。当服务器在响应函数中返回时，将state设置为waiting user，并将相应的时间变量init设置为now（）。下一个_level（）应该将状态设置为playing，并将相应的时间变量初始化为now（），以便计时器可以计数。将上面的代码视为引用而不是复制粘贴资源。 我想这就是你想要的：


constpages=[1,2,3,4,5]；
run（）；
异步函数run（）{
for（设i=0；i{
设置超时（res，10000）；
});
}
函数displayResult（结果）{
text.innerText='结果：'+结果；
返回新承诺（res=>{
设置超时（res，2000）；
});
}
您的代码工作正常。2秒是2000毫秒。我知道它是有效的（谢谢，我会编辑它），但我想知道是否有更好的方法。比如说，如果我有30个关卡的话，它会很长，而且重复性很强。第一个版本很好用。
setInterval(funcWorker,1000,s_gameObj);



 function funcWorker(f_context){
    var l_dateNow = new Date();
    if(f_context.is_playing){
       var l_elapsed = l_dateNow.getTime() - f_context.dateLevelStart.getTime();
       if(l_elapsed.totalSeconds() >= f_context.LEVEL_TIME){

           f_context.end_level();
       }
    }else if(f_context.is_waiting_user){
       //same check as above but on the waiting start 
        ....
         f_context.next_level();


    }else if(f_context.is_waiting_server){
       //do whatever
    }
}