Javascript 날짜 비교 하기 및 new Date() 크로스 브라우징

제가 주로 사용하는 MS-SQL에서는 Date를 "2019-04-18 13:35:40.324" 형식으로 저장합니다. 이 값을 그대로 뷰페이지에 넘겨 처리하다보면 익스플로러나 사파리에서는 정상적으로 인식하지 못하는 경우가 종종 있습니다. 

 

익스나 사파리같은 경우에는 시간을 "2019-04-18T13:35:40.324" 형식으로만 인식하기 때문입니다. 

 

따라서 아래와 같이 파싱해줘야 익스플로러와 사파리에서도 정상적으로 시간 처리를 할 수 있습니다.

 

간단하게 replace로 대체해도 되고, toISOString()이라는 메소드를 사용하여 파싱해도 됩니다. 

  <script>
 
    var inDate = "2019-04-15 14:00:00.000";
 
    var afterDate1 = inDate.replace(" ", "T");
 
    var afterDate2 = new Date(inDate).toISOString();
 
    var afterDate3 = afterDate1.slice(0,10).replace(/-/g,".");
 
    console.log(inDate + " // " + afterDate1 + " // " + afterDate2 + " // " + afterDate3);
 
  </script>

<결과>

2019-04-15 14:00:00.000 // 2019-04-15T14:00:00.000 // 2019-04-15T05:00:00.000Z // 2019.04.15

 

 

다음은 DB에 저장된 Date를 기준시간(클라이언트 시간 기준 현재 시간 - 일 수)과 비교하여 게시글의 Date가 기준시간보다 최신이면 true, 아니면 false를 반환하는 함수입니다.

 

function jsIsNew(date, isNewDay) {
    
    // 현재 시간 설정
    var nowTime = new Date().getTime();
    
    // 게시글 시간 설정
    date = date.replace(" ", "T");
    var inTime = new Date(date).getTime();
    
    // new가 붙을 기준 날짜 설정(day 기준)
    var newTime = nowTime - (86400000 * isNewDay);
    
    // 기준 시간 이후에 등록된 게시글이면 true 반환, 기준 시간 이전에 등록된 게시글면 false 반환
    if(inTime > newTime) {
        return true;
    } else {
        return false;
    }
 
}

 

기본적으로 js에서 날짜 계산은 getTime()을 가지고 합니다. getTime()은 밀리초 단위로 나오고, 하루는 86400000 밀리초 이므로, 현재 시간에서 86400000 * 기준일수만큼 빼서 기준 시간을 설정합니다. 

 

마지막으로 뷰페이지에서 jsIsNew 함수로 게시글의 DB Date와 기준일자를 입력하여 반환값이 true면 NEW를 띄워주면 됩니다. 

 

 

간단하게 끝!

TIP) yyyy-MM-dd HH:mm:ss.SSS 형식을 간단하게 yyyy.MM.dd로 변경하기

var inDate = '2019-04-18 13:35:40.324';
 
var newDateFormat = inDate.slice(0,10).replace(/-/g,".");