JavaScriptで取得した現在時刻への加算

Question

前提・実現したいこと

JavaScriptを使って現在時刻を表示するHTMLソースを作成しています。
取得した現在時刻に任意の時間を加算（繰り上げ）して、例えば10秒先の時間を表示したいと思っております。
JavaScriptに関する知識が浅いため、是非解決案をご教授いただけますと幸いです。よろしくお願いいたします。

発生している問題・エラーメッセージ

秒数や分数が上限（59）を超えて増えてしまう。
秒数の前に不明な数字（16286679）が表示される。

該当のソースコード

  <p id="time"/>
  <script language="JavaScript">
  const hhmiss = function() {
    const dt = new Date();
      const  hh = toDoubleDigits(dt.getHours()),
             mi = toDoubleDigits(dt.getMinutes()),
             ss = toDoubleDigits(dt.setSeconds(dt.getSeconds()+10));
    const element = document.getElementById("time");
    element.innerHTML = hh + ':' + mi +'<span>'+ ss +'</span>';
  };
  const toDoubleDigits = function(num) {
    num += "";
    if (num.length === 1) {
      num = "0" + num;
    }
   return num;
  };
  setInterval(hhmiss, 1000);

  </script>

Comments

[tkturbo]

> 取得した現在時刻に任意の時間を加算

↑この部分の実装はどこですかー？

[mino2ki]

すみません、記載したソースコードに抜けがありました。
サンプルのコードでは10秒進めたかったので以下のようにコードを書きましたが、他の方よりsetSecondsでは秒数を表示できないと伺いました。秒数を表示するにはどうすれば良いでしょうか？

ss = toDoubleDigits(dt.setSeconds(dt.getSeconds()+10));

Answer 1

setSecondsの返り値は秒数ではありません。1970年1月1日から現在まで何ミリ秒経過したかを返します（MDN）。

Answer 2

(都合により削除)

Comments

[mino2ki]

dayjsというものがあるのですね、勉強になります。
とてもわかりやすく、問題も解決できました。ありがとうございます！

Answer 3

「10秒後の時刻を表示」なら、こうすればいいんでは？

const dt = new Date();
dt.setSeconds(dt.getSeconds()+10);

console.log(
  toDoubleDigits(dt.getHours()) + ":" +
  toDoubleDigits(dt.getMinutes()) + ":" +
  toDoubleDigits(dt.getSeconds())
);

Answer 4

こういうことですか？

    const dt = new Date(new Date()+10);
      const  hh = toDoubleDigits(dt.getHours()),
             mi = toDoubleDigits(dt.getMinutes()),
             ss = toDoubleDigits(dt.getSeconds());