JavaScript 倒计时，将秒格式化为 HH :MM:SS

Question

我有一个倒计时器，它需要“秒”并将其格式化为 HH:MM:SS 格式。问题是第二个显示 60。

这是我的代码，这是一个更大的类的一部分。关于最佳方式格式的任何建议，以便它不使用“60”作为秒。

谢谢!

formatSeconds: function (seconds) {

    secondsRemaining = seconds;
    hoursRemaining = Math.floor(secondsRemaining / (60 * 60));
    minutesRemaining = secondsRemaining % (60 * 60);

    hourMinutesRemaining = Math.floor(minutesRemaining / 60);
    minuteSecondsRemaining = minutesRemaining % 60;
    hourSecondsRemaining = Math.ceil(minuteSecondsRemaining);

    fHrs = this.formatNumber(hoursRemaining);
    fMins = this.formatNumber(hourMinutesRemaining);
    fSecs = this.formatNumber(hourSecondsRemaining);

    return fHrs + ':' + fMins + ':' + fSecs;
},

formatNumber: function (number) {
    var s = String(number);
    if (s.length == 1) {
        s = '0' + s;
    }
    return s;
}

Answer 1

更新:这是之前功能的新版本。我注意到以前版本中存在一个错误，原因是当秒数接近小时或分钟边界时出现浮点舍入错误。从概念上讲，数学是正确的，但实际上，使用 IEEE-754 数字精度时，情况并非如此。

<小时/>

这是我为此目的在代码中使用的函数:

const formatSeconds = (secs) => {
  const pad = (n) => n < 10 ? `0${n}` : n;

  const h = Math.floor(secs / 3600);
  const m = Math.floor(secs / 60) - (h * 60);
  const s = Math.floor(secs - h * 3600 - m * 60);

  return `${pad(h)}:${pad(m)}:${pad(s)}`;
}

演示

// Test harness
const demo = () => {
  var seconds = 36005;
  var $output = document.querySelector('.output');

  return () => {
    if (seconds >= 0) {
      $output.innerHTML = `${formatSeconds(seconds)} (${seconds} seconds)`;
      seconds--;
    }
  };
}
setInterval(demo(), 1000);

// The function
const formatSeconds = (secs) => {
  const pad = (n) => n < 10 ? `0${n}` : n;

  const h = Math.floor(secs / 3600);
  const m = Math.floor(secs / 60) - (h * 60);
  const s = Math.floor(secs - h * 3600 - m * 60);

  return `${pad(h)}:${pad(m)}:${pad(s)}`;
}

<div class="output"></div>

测试代码

这是一个基本测试，旨在验证这个新函数是否可以在没有边缘情况的情况下正常工作。

const formatSeconds = (secs) => {
  const pad = (n) => n < 10 ? `0${n}` : n;

  const h = Math.floor(secs / 3600);
  const m = Math.floor(secs / 60) - (h * 60);
  const s = Math.floor(secs - h * 3600 - m * 60);

  return `${pad(h)}:${pad(m)}:${pad(s)}`;
}

const countSeconds = (str) => {
  const parts = str.split(':');
  const h = parseInt(parts[0], 10);
  const m = parseInt(parts[1], 10);
  const s = parseInt(parts[2], 10);

  return h * 3600 + m * 60 + s;
}

const compare = (secs) => secs === countSeconds(formatSeconds(secs));

var falses = 0;
for (let i = 0; i < 999999; i++) {
  if (compare(i) === false) {
    falses++;
    console.log(`Error: ${i} Seconds`);
  }
}

console.log(`${falses} errors`);