Question

我试图让消息在我的网站上显示，每3秒一次。我通过带有forEach函数的数组（包含消息）将其放入setTimeout函数中来进行此操作，但是它只是在3秒后显示最后一条消息，而不是在3秒后显示所有消息。

我尝试调试，但奇怪的是它确实可以在调试中工作，只是没有它。

const travelIntro = $text => {
  const arrMessages = ['You are travelling through empty space...', 'You wake up with only 5% oxygen left barely breathing', 'All of the sudden your ship starts up'];
  arrMessages.forEach(message => {
    setTimeout(function () {
      $text.innerHTML = message;
    }, 3000);
  });
}

因此，我希望它能在3秒钟后在每条消息之间切换，而不仅仅是显示数组中的最后一条消息。

Answer 1

您肯定需要学习Java异步的性质

forEach循环实际上将非常快地运行，并且对于每条消息，它将立即开始超时。每个超时将在启动后触发3000毫秒。因此它们都在3000毫秒后发射，一个又一个。

为使第二个触发在第一个触发后3000毫秒触发，后者在3000毫秒后触发，您可能需要建立某种手动循环

    const arrMessages = ['You are travelling through empty space...', 'You wake up with only 5% oxygen left barely breathing', 'All of the sudden your ship starts up'];

    function doLoop(i) {
       let message = arrMessages[i];
       setTimeout(function () {
          $text.innerHTML = message;
          if(i < arrMessages.length-1)
             doLoop(i+1);
       }, 3000);
    }

    doLoop(0);

Answer 2

我认为您正在寻找dependencies: firebase_analytics: cloud_firestore: graphql_flutter: ^1.0.0 firebase_auth: firebase_core: mobx: ^0.1.2 flutter_mobx: ^0.1.1 mobx_codegen: ^0.1.0+1 carousel_pro: ^0.0.13 cupertino_icons: ^0.1.2 flutter: sdk: flutter，然后在返回未定义时将其清除。在这里拨弄：https://jsfiddle.net/xukL1w0a/

setInterval

如何修复：forEach函数中的setTimeout函数未遵循正确的超时

2 个答案: