Question

我对Javascript和HTML相当陌生，所以我想有一种更好的方法来实现这一目标。

情况：
我有一系列持续时间var TimeArray =[65,10,35];
我想创建一个计时器，按顺序运行这些时间。即。 65分钟过去后，计时器应运行10分钟。然后经过10分钟后，运行35分钟。

我最初的想法是将 setInterval 放入 For循环中，但是我很快意识到这是行不通的，因为for循环只会不断更新而不等待 setInterval 完成。

因此，作为变通办法，我创建了以下递归算法，取出了for循环并创建了全局变量var section，该变量在每次调用该算法时都会增加。

var TimeArray =[65,10,35];
var section = 0;

    function StartTimer(){
      if (section < TimeArray.length){
        var deadline = new Date();
        deadline.setMinutes(deadline.getMinutes() + TimeArray[section]);
        var x = setInterval(function() {
        var now = new Date().getTime();
        var t = deadline - now;
        var hours = Math.floor((t%(1000 * 60 * 60 * 24))/(1000 * 60 * 60));
        var minutes = Math.floor((t % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((t % (1000 * 60)) / 1000);
       document.getElementById("demo").innerHTML = hours + "h " + minutes + "m " + seconds + "s ";
          if (t < 0) {
            clearInterval(x);
            document.getElementById("demo").innerHTML = "EXPIRED";
            section++;
            StartTimer();
          }
        }, 1000);
      }
      else{
        return;
      }
    }

该算法完全按照我想要的方式工作，但是我真的不喜欢必须使用递归的事实。我不希望它继续添加到内存堆栈中。有没有办法使用迭代并仍然保留功能？

谢谢！

提高倒数计时器代码的质量和效率

0 个答案: