본문 바로가기
JavaScript

[ JavaScript ] moment.js 라이브러리 사용해보기

by teamnova 2022. 12. 11.

안녕하세요!

오늘은 moment.js를 이용해 javascript에서 날짜를 다뤄보는 방법을 알아보겠습니다.

 

moment.js는 javascript에서 날짜 관련해 많이 쓰이는 라이브러리입니다.

moment.js를 사용하기 위해 npm 또는 cdn 등을 쓸 수 있습니다.

공식홈페이지에서 더 다양한 사용법을 확인해볼 수 있습니다.

https://momentjs.com/

 

Moment.js | Home

Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYYYMMDD").fromNow(); moment("20120620", "YYYYMMDD"

momentjs.com

 

1. 사용준비

아래 처럼 사용준비를 합니다.

1) npm을 통해 설치하는 방법

npm install moment --save   # npm

2) CDN을 사용하는 방법

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

 

moment.js를 사용하는 방법입니다. 아래처럼 다양하게 활용해볼 수 있습니다.

 

2. 사용방법

moment.js를 사용하는 방법입니다. 아래처럼 다양하게 활용해볼 수 있습니다.

1) 포맷지정하기: format()

* format 함수를 사용해 원하는 포맷을 입력할 수 있습니다.

// Format Dates
var now = moment();
console.log(now.format());	// 2022-09-09T23:45:49+09:00
console.log(now.format("YY-MM-DD"));	// 22-09-09
console.log(now.format("DD/MM/YY"));	// 09/09/22
console.log(now.format("YYYY.MM.DD HH:mm:ss"));	// 2022.09.09 23:45:49

moment().format('MMMM Do YYYY, h:mm:ss a'); // September 9th 2022, 11:37:25 pm
moment().format('dddd');                    // Friday
moment().format("MMM Do YY");

moment(new Date()).format("h:mm A") // 2:30 오전/오후
moment().format("YYYY-MM-DD"); // 2020-09-09
moment().format("HH:mm:ss");   // 12:12:01

 

2) 날짜 및 시간 더하기: add()

console.log(moment().format()); //2022-09-09T23:51:01+09:00

console.log(moment().add(1, "years").format()); // 2023-09-09T23:51:01+09:00
console.log(moment().add(1, "y").format()); // 2023-09-09T23:51:01+09:00

console.log(moment().add(1, "months").format());  // 2022-10-09T23:51:01+09:00
console.log(moment().add(1, "M").format());     // 2022-10-09T23:51:01+09:00

console.log(moment().add(1, "weeks").format()); // 2022-09-16T23:51:01+09:00
console.log(moment().add(1, "w").format()); // 2022-09-16T23:51:01+09:00

 

3) 날짜 및 시간 빼기: subtract()

console.log(moment().format()); //2022-09-09T23:51:01+09:00

console.log(moment().subtract(1, "years").format()); // 2021-09-09T23:52:30+09:00
console.log(moment().subtract(1, "y").format()); // 2021-09-09T23:52:30+09:00

console.log(moment().subtract(1, "months").format());  // 2022-08-09T23:52:30+09:00
console.log(moment().subtract(1, "M").format());     // 2022-08-09T23:52:30+09:00

console.log(moment().subtract(1, "weeks").format()); // 2022-09-02T23:52:30+09:00
console.log(moment().subtract(1, "w").format()); // 2022-09-02T23:52:30+09:00

 

4) 날짜 및 시간 차이 구하기: diff()

var now = moment();
var date2 = moment("2021-10-08");

console.log(now.format()); //2022-09-09T23:55:36+09:00
console.log(date2.format()); //2021-10-08T00:00:00+09:00

console.log(now.diff(date2)); // 29116558784
console.log(now.diff(date2, "years")); // 0
console.log(now.diff(date2, "months")); // 11
console.log(now.diff(date2, "weeks")); // 48
console.log(now.diff(date2, "days")); // 336
console.log(now.diff(date2, "hours")); // 8087

 

5) 현재날짜 및 시간 기준으로 상대적인 시간 구하기: fromNow()

* fromNow()함수를 사용해 현재로 부터의 차이를 구할 수 있습니다.

console.log(moment().format()); // 2022-09-09T23:57:57+09:00
console.log(moment().fromNow()); // a few seconds ago
console.log(moment().startOf("day").fromNow()); // a day ago
console.log(moment().endOf("day").fromNow()); // in 2 minutes
console.log(moment("2021-10-08").fromNow()); // a year ago

 

포맷들의 의미는 아래와 같습니다.