RATSENO

[JS]moment.js를 이용한 날짜 형식 다루기 본문

DEV/JS

[JS]moment.js를 이용한 날짜 형식 다루기

RATSENO 2019. 11. 13. 12:08

자바스크립트 Date 객체에서 제공하는 날짜 형식은 별로 다양하지 않고, 이 형식 중에 원하는것이 없다면

직접 만들어야 합니다. moment.js는 원하는 형식을 쉽게 만들 수 있은 편이므로, 날짜 표시에 유용하게 쓰일 수 있습니다.

 

moment.js의 format 메서드를 써서 날짜를 원하는 형식으로 만들 수 있습니다.

이 메서드는 메타 문자가 포함된 문자열을 받고, 메타 문자는 그에 해당하는 날짜 구성 요소로 변환됩니다.

예를 들어 문자열 YYYY는 네 자리 연도로 바뀝니다. 밑의 예제는 Date 객체의 내장된 메서드와 moment.js 메서드로

날짜 형식을 만든 예제입니다.

const d = new Date(Date.UTC(2019, 11, 13));
//d -> Fri Dec 13 2019 09:00:00 GMT+0900 (한국 표준시)
/*
Date.UTC() 메서드는 1970 년 1 월 1 일 00:00:00 (세계 표준시) 이후 
Date 객체의 밀리 초 수를 반환하는 데 사용됩니다.
UTC() 메소드는 두 가지 방법으로 Date 생성자와 다릅니다.
- Date.UTC ()는 현지 시간 대신 표준시를 사용합니다.
- Date.UTC ()는 Date 객체를 만드는 대신 시간 값을 숫자로 반환합니다.
*/

d.toLocaleDateString();
//"2019. 12. 13."
d.toLocaleTimeString();
//"오전 9:00:00"
d.toTimeString();
//"09:00:00 GMT+0900 (한국 표준시)"
d.toUTCString();
//"Fri, 13 Dec 2019 00:00:00 GMT"

moment(d).format("YYYY-MM-DD");
//"2019-12-13"
moment(d).format("YYYY-MM-DD HH:mm");
//"2019-12-13 09:00"
moment(d).format("YYYY-MM-DD HH:mm:Z");
//"2019-12-13 09:00:+09:00"
moment(d).format("YYYY-MM-DD HH:mm [UTC]Z");
//"2019-12-13 09:00 UTC+09:00"
moment(d).format("YYYY년 M월 D일 HH:mm");
//"2019년 12월 13일 09:00"
moment(d).format("dddd, MMMM [the] Do, YYYY");
//"Friday, December the 13th, 2019"
moment(d).format("h:mm a");
//"9:00 am"

 

이외의 다양한 출력 형식은 

https://momentjs.com/docs/

 

Moment.js | Docs

moment.relativeTimeThreshold(unit); // getter moment.relativeTimeThreshold(unit, limit); // setter duration.humanize has thresholds which define when a unit is considered a minute, an hour and so on. For example, by default more than 45 seconds is consider

momentjs.com

공식 홈페이지의 Docs에서 확인해 볼 수 있습니다.

'DEV > JS' 카테고리의 다른 글

[JS]Ajax  (0) 2019.11.19
[JS]이벤트 버블링과 캡처링  (0) 2019.11.15
[JS]날짜 데이터 전송하기  (0) 2019.11.13
[JS]moment.js를 이용한 Timezone 다루기 (Date)  (0) 2019.11.12
[JS]Date 객체 만들기  (0) 2019.11.12
Comments