[javascript] 날짜 문자열을 Date 객체로 변환

관련지식
javascript, node.js, date

moment 라이브러리를 사용하지 않는다면 javascript 내장 객체인 Date객체는 꽤 자주 사용하게 될 것입니다. 날짜 포맷팅 또는 날짜 계산을 위해서 말이죠. 그런데 문자열로 된 날짜를 Date 객체로 편리하게 변환 방법을 모르는 분들이 많아서 간단하게 정리해봤습니다.

2020.03.19 라는 값의 문자열이 있다고 할때, 해당값을 가진 Date 객체를 만들기 위해서 대부분의 개발자는 아래처럼 할 것입니다.(substring 함수를 썼다고 가정합시다.)

그런데 월(月)에 해당하는 인자는 0~11의 값으로 이루어지기 때문에 문자열의 월 부분을 잘라내고 빼기까지 해야하는 경우가 발생합니다. 굉장히 불편하죠. 이렇기 때문에 moment 라이브러리를 이용하거나 날짜 관련 공통함수를 만드는 것이지만, 지금은 그러한것들이 없다고 가정하겠습니다. 또는 공통함수를 어떻게 만들지 고민하는 중이라고 하죠.

만약 제한된 환경, 예를들어 최신 브라우저에서만 동작하면 될경우 날짜 문자열을 그대로 파싱할수도 있습니다.

Date 객체나 Date.parse() 함수에는 datestring을 인자값으로 사용할수가 있습니다. 다만 RFC2822 또는 ISO8601 형태로 이루어진 날짜만을 사용할수 있을 뿐입니다. 또한 브라우저마다 문자열 구문 분석이 조금씩 다를수 있기 때문에 ES5까지는 권장되진 않습니다. 한번 브라우저 별로 비교해보겠습니다.

왼쪽부터 크롬, 파이어폭스, 인터넷 익스플로러11 입니다. ‘년.월.일’ 포맷에 대해서 파싱이 되는것은 크롬이 유일한것을 보실수 있습니다. 버전별로 정리해보겠습니다.

	크롬	파이어폭스	IE11	IE9	IE8	특이사항
2020.03.19	O	X	X	X	X
2020-03-19	O	O	O	O	X	9시 디폴트 세팅
2020/03/19	O	O	O	O	O

만약 사이트에서 ‘년/월/일’ 포맷을 사용한다면 브라우저 버전을 걱정하지 않아도 됩니다. ‘년-월-일’ 일때도 크게 걱정하지 않아도 됩니다. IE8에서는 사용할수 없지만 곧 윈도우7도 공식지원이 종료되니 특별한 이유가 없다면 IE8은 배제해도 될것 같습니다. ‘년.월.일’ 포맷을 사용하는 경우는 거의 모든 브라우저가 지원하지 않아서 사용이 어려워 보입니다.

1. Node.js에서는 사용가능
2. 개발 규칙을 정해두면 사용가능

Node.js는 크롬V8엔진 기반이기 때문에 ‘년.월.일’ 포맷도 문제 없습니다. 그리고 아래와 같은 개발 규칙을 따른다면 다른 브라우저에서도 문제없이 사용 가능합니다.

공통함수)

if(!Date.parse || !Date.parse('2001.01.01')) {  //if조건은 생략해도 상관없음. 날짜는 파싱 가능 여부 확인용으로 날짜 자체는 의미없음
  Date.parse = function(datestring) {
    return new Date(datestring.replace(/\./g, '/')).getTime();
  }
}

함수 사용)

new Date(Date.parse('2020.03.19'))

new Date()는 timestamp 를 인자로 사용 가능하므로, Date 객체를 생성할때는 항상 parse() 함수를 통해 한다는 규칙을 따르면 모든 브라우저에서 동작하도록 할수 있습니다. timestamp 값은 다양한곳에서 사용하기 좋으므로, parse()함수를 재정의 하는 방법은 Date 생성을 위한 별도의 함수를 작성하는 것보다 더 좋은 결과를 얻을수 있습니다. 이제는 편리하게 날짜 변환을 하시죠!