/**
 * 指定した桁数に0埋めする関数
 * @param {int} num 対象の数値
 * @param {int} zeroLength 埋めたい0の数
 * @return {String} 0埋めされた文字列
 */
const zeroPadding = (num, zeroLength) => {
  // "0"を入れるための変数
  let zero = "";

  // zeroLength個の"0"をつける
  for (let i = 0; i < zeroLength; i++) {
    zero += "0";
  }

  // numの前に指定した数の"0"をつけ、末尾の文字数を削る
  return (zero + num).slice(-zeroLength);
};

// 時計表示用のHTMLの要素を取得
const clockElement = document.getElementById("clock");

/**
 * 現在時刻を取得し、DOMを書き換える関数
 */
const clockSetting = () => {
  // クラスのインスタンス化
  const currentDate = new Date();
  // 年
  const year = currentDate.getFullYear();
  // 月
  const month = currentDate.getMonth() + 1;
  // 日
  const day = currentDate.getDate();
  // 曜日のリスト
  const dayOfWeek = ["日", "月", "火", "水", "木", "金", "土"];
  // 曜日の番号を取得
  const weekNumber = currentDate.getDay();
  // 時間
  const hour = currentDate.getHours();
  // 分
  const min = currentDate.getMinutes();
  // 秒
  const sec = currentDate.getSeconds();

  // 現在時刻
  const myClock =
    year +
    "/" +
    zeroPadding(month, 2) +
    "/" +
    zeroPadding(day, 2) +
    " " +
    dayOfWeek[weekNumber] +
    "曜日 " +
    zeroPadding(hour, 2) +
    ":" +
    zeroPadding(min, 2) +
    ":" +
    zeroPadding(sec, 2);

  // DOMの書き換え
  clockElement.innerHTML = myClock;
};

// 1000ミリ秒間隔でclockSetting関数を実行する
setInterval(clockSetting, 1000);