JavaScript 디데이 일수 계산하기

간단한 디데이 위젯을 만들었던 코드다.

 

const setDate = (params, rootElement) => {
  function getDaysDifference(targetDate) {
    const today = new Date();
    const gap = today - targetDate;
    return Math.floor(gap / (1000 * 60 * 60 * 24));
  }

  const date = params.get("date");

  if (!date || date.length !== 8) {
    console.error("Invalid Date: ", date);
    rootElement.querySelector(".date").textContent = "Invalid Date";
    rootElement.querySelector(".counter").textContent = "ERROR";
    return;
  }

  const year = parseInt(date.slice(0, 4), 10);
  const month = parseInt(date.slice(4, 6), 10);
  const day = parseInt(date.slice(6), 10);

  const targetDate = new Date(year, month - 1, day);

  if (isNaN(targetDate.getTime())) {
    console.error("Invalid Date Object: ", targetDate);
    rootElement.querySelector(".date").textContent = "Invalid Date";
    rootElement.querySelector(".counter").textContent = "ERROR";
    return;
  }

  const dateElement = rootElement.querySelector(".date");
  const counterElement = rootElement.querySelector(".counter");

  dateElement.textContent = `${year}-${month}-${day}`;
  
  const diff = getDaysDifference(targetDate);
  const prefix = diff > 0 ? "D+" : "D";
  counterElement.textContent = diff === 0 ? "TODAY" : prefix + Math.abs(diff);
};

 

위젯에 있었던 코드는 단순히 date 문자열을 8자로 잘라 YYYY-MM-DD 형식으로 표출했었는데

이 코드에서는 유효한 날짜인지 체크하는 로직을 추가했다.

 

테스트를 진행한 후 실제 위젯에도 적용하고, 더 자세히 글을 수정할 예정이다.