자스에서 날짜 비교하기

Yerin·2024년 5월 29일

세감에서는 날짜 비교를 하여 db를 조회하는 일이 정말 많다. (강의나 과제 마감일을 체크 해야하기 때문에..)

날짜를 비교하다 보니 이상함을 느끼기 시작했다.

문제점

다음 코드를 보았을 때 어떤 결과가 나올 것 같은가?

const date1 = new Date('2024-05-29');
const date2 = new Date('2024-05-29');

console.log(date1);
console.log(date2);

console.log(date1 === date2);

true라고 대답했다면 당신은 자스에서 날짜 비교를 하는 법에 대해 공부해볼 기회를 가질 수 있게 된것이다 ^^

아마 다음 코드를 보면 더 어이가 없을거다..

const date1 = new Date('2024-05-29');
const date2 = new Date('2024-05-29');

console.log(date1 < date2);
console.log(date1 > date2);
console.log(date1 <= date2);
console.log(date1 <= date2);
console.log(date1 === date2);

비교연산자 vs 동등연산자

이런일이 일어나는 이유는 바로 js에서의 비교연산자와 동등연산자의 차이 때문이다.

여기서 사용한 Date는 js에서 제공해주는 내장객체이다.

그런데 js에서는 비교연산자는 값을 비교하는데, 동등연산자는 객체 참조를 비교하게끔 되어있다.

그래서 세감에서 비교연산자를 사용하여 날짜비교를 할 때는 괜찮았는데

동등비교를 하는 순간부터 로직이 꼬여버린 것이었다.

날짜를 비교하는 법

함수 중에 getTime() 이라는 함수가 있다.

1970년 1월 1일부터 경과된 시간을 밀리초로 표기하는 함수이다.

이걸 이용하면 두 날짜를 비교할 수 있다.

const date1 = new Date('2024-05-29');
const date2 = new Date('2024-05-29');

console.log(date1.getTime());
console.log(date2.getTime());
console.log(date1.getDate() === date2.getDate());

아니면 valueOf() 라는 함수로도 비교 가능하다.

valueOf() 메서드는 원래부터 js에서 특정 객체의 원시 값을 반환하는데 쓰이는데, Date 객체에서는 valueOf가 getTime 함수와 동일하게 970년 1월 1일부터 경과된 시간을 밀리초로 표기한다.

(그런데 Date 비교할 때는 보통 getTime()을 쓴다고 하니 그냥 getTime 쓰도록 하자)

const date1 = new Date('2024-05-29');
const date2 = new Date('2024-05-29');

console.log(date1.valueOf());
console.log(date2.valueOf());
console.log(date1.valueOf() === date2.valueOf());

다시 문제점

자 ~ 그러면 문제점이 다 해결되었을까?

여전히 세감의 문제는 해결되지 않았다.

세감에서는 DB에 시간을 등록할 때 초까지 등록하는데, (마감 시간 같은거 저장해야할때)

우리는 날짜 비교만 원했다.

어떤 경우였는지 잘 기억은 안나지만, 시간을 제외하고 날짜 비교만 필요한 기능이 있었다.

const endDate = new Date(2024, 4, 29, 17, 30, 0); // 2024년 5월 29일 14시 30분
const today = new Date(2024, 4, 29); // 2024년 5월 29일 15시

console.log(endDate.getTime());
console.log(today.getTime());
console.log(endDate.getTime() === today.getTime()); //false

이런 경우에는 날짜만 비교해야하는데, 초까지 비교하게 되므로 당일인지는 구분 못하게 되는 것이다.

같은 날인지 비교하는 방법

function isSameDate(date1: Date, date2: Date): boolean {
  return (
    date1.getFullYear() === date2.getFullYear() &&
    date1.getMonth() === date2.getMonth() &&
    date1.getDate() === date2.getDate()
  );
}