[JavaScript] 커스텀 날짜 포맷 함수 사용하기

자바스크립트로 날짜를 구할 때 보통 new Date()를 사용한다.

그러나 console로 해당 결과를 출력해보면 아래와 같이 나타난다.

Tue Feb 07 2023 22:22:03 GMT+0900 (한국 표준시)

너무나 좋은 기능이지만 우리는 보통 날짜를 웹 상에서 나타내거나

특정 기간을 조회하는 API를 호출할 때 보통 yyyyMMdd, yyyy/MM/dd 등의 형식으로 날짜 데이터를 사용한다.

즉, 위의 날짜 결과를 원하는 형식에 맞게 가공해줘야 할 필요성을 항상 느낀다.

매번 프로젝트를 시작할 때 비슷한 현상을 겪어왔으며

이를 번복하지 않기 위해 함수를 하나 만들었다.

(필요하면 함수를 복붙해서 쓸 예정이다.)

만들어질 함수는 연/월/일별 날짜를 더하거나 뺄 수 있으며

기본적으로 yyyyMMdd 형태로 날짜 데이터를 가공하여 리턴하나

별도의 구분자를 파라미터로 넘기면 yyyy/MM/dd 등의 형식으로 리턴할 수 있도록 작성하였다.

/**
 * @description
 * - 날짜를 더하거나 빼서 리턴하는 함수입니다.
 * - 현재 날짜를 구하고 싶다면 빈 파라미터로 함수를 호출하면 됩니다.
 * @param {String} type
 * -- "year", "month", "date" 중 날짜를 연산할 단위 선택하여 parameter로 사용.
 * - 미입력 혹은 "year", "month", "date" 외 다른 문자열 입력시 default : "date"
 * @param {Number} addition
 * -- 더하거나 뺄 날짜 value parameter.
 * - 미입력시 오늘 날짜 리턴
 * @param {String} separator
 * -- "/", "-"등 입력된 기호로 연,월,일을 구분하는 기호.
 * - 미입력시 default : "yyyyMMdd"
 */
function getFormattedDate(type, addition, separator) {
  //한국 현재 시간 구하기
  const now = new Date();

  const utc = now.getTime() + now.getTimezoneOffset() * 60 * 1000;
  const koreaTimeDiff = 9 * 60 * 60 * 1000;
  let korNow = new Date(utc + koreaTimeDiff);

  let year = korNow.getFullYear();
  let month = korNow.getMonth() + 1; //month는 1~12월이 아닌 0~11월로 계산되므로 + 1을 해준다.
  let date = korNow.getDate();

  //type, addition 연산 처리 시작
  if (addition !== undefined) {
    switch (type) {
      case "year":
        korNow = new Date(korNow.setFullYear(year + addition));
        break;
      case "month":
        korNow = new Date(korNow.setMonth(month - 1 + addition)); //원래 getMonth는 month - 1이므로 1을 빼준다.
        break;
      case "date":
        korNow = new Date(korNow.setDate(date + addition));
        break;
      default:
        korNow = new Date(korNow.setDate(date + addition));
        break;
    }
    year = korNow.getFullYear();
    month = korNow.getMonth() + 1;
    date = korNow.getDate();
  }

  return `${String(year)}${separator || ""}${
    String(month).length === 1 ? "0" + String(month) : String(month)
  }${separator || ""}${
    String(date).length === 1 ? "0" + String(date) : String(date)
  }`;
}
//현재날짜 2023-02-07
getFormattedDate("year", 5, "");
//result : 20280207

getFormattedDate("month", 16, "/");
//result : 2024/07/07

getFormattedDate("date", 720, "-");
//result : 2025-01-27

마무리하며

날짜 가공하는 함수는 언젠가 해야겠다고 마음을 먹었지만 잘 되지 않았던 것 같다.
이번에 정리한 함수가 추후 코딩하는 시간을 줄이는데 기여하기를 바란다.
ps. 함수가 괜찮다 싶으면 복붙해서 사용하셔도 좋습니다.
또한 함수에 문제가 있거나 더 좋은 방법이 있다면 소개 부탁드리겠습니다.