개요
JavaScript에서 날짜는 기본적으로 1970년 1월 1일 자정(UTC)을 기준으로 경과한 시간을 밀리초 단위로 표현합니다. 따라서 서버나 API로부터 1514789449605처럼 긴 숫자 형태의 에포크(Epoch) 타임스탬프를 전달받았다면, 이를 사람이 읽기 쉬운 의미 있는 날짜 형식으로 변환해 주어야 합니다.
변환 원리
에포크 값을 날짜로 바꾸는 과정은 다음과 같습니다.
substr(6): "/Date(1514789449605)/" 문자열에서 앞부분("/Date(")을 잘라내고 숫자 부분만 추출합니다.parseFloat(): 추출한 문자열을 숫자(밀리초)로 변환합니다.new Date(): 밀리초 값을 인자로 전달하여 Date 객체를 생성합니다.- 각종 getter 메서드(
getFullYear(),getMonth(),getDate(),getHours()등)를 활용해 원하는 형식으로 조합합니다.
특히 주의할 점은 getMonth()가 0부터 11까지의 값을 반환한다는 것입니다. 실제 월을 얻으려면 반드시 +1을 더해야 합니다.
예제 코드
<html>
<head>
<title>JavaScript Dates</title>
</head>
<body>
<script>
var val = "/Date(1514789449605)/";
var myDate = new Date(parseFloat(val.substr(6)));
document.write(
"Converted Date:" +
(myDate.getMonth() + 1) + "/" +
myDate.getDate() + "/" +
myDate.getFullYear() + " " +
myDate.getHours() + ":" +
myDate.getMinutes() + ":" +
myDate.getSeconds()
);
</script>
</body>
</html>
실행 결과
Converted Date:1/1/2018 12:20:49
정리
밀리초 단위의 에포크 값은 new Date(밀리초) 한 줄이면 Date 객체로 손쉽게 변환됩니다. 생성된 객체의 getter 메서드들을 조합하면 "연도/월/일 시:분:초"와 같이 사용자에게 친숙한 날짜 형식을 자유롭게 만들어 화면에 출력할 수 있습니다.