자바스크립트 날짜, 시간 라이브러리 Momentjs 정보와 예제

자바스크립트에서 날짜, date 라이브러리를 가장 잘 알려진 momentjs에 대하여 알아봅니다.

! moment.js는?

자바스크립트를 사용하여 날짜 및 시간과 관련된 값을 얻거나 변경 등 다양한 조작이 필요한 경우 가장 많이 사용되는 라이브러리 중 하나입니다. 예를 들어 어제 날짜 또는 일 주일 전, 한 달 전 등 복잡한 날짜, 시간을 쉽고 편리하게 얻을 수 있습니다. 그 외에도 날짜 포맷을 변경 할 수 있고 원하는 날짜를 쉽게 선택하는 것을 물론 다양한 언어를 제공하는 것도 장점입니다.

- 날짜, 시간의 원하는 포맷을 쉽게 얻기
- 어제, 일 년 전 등의 특정 날짜 값을 쉽게 가져올 수 있음
- 다양한 언어 설정이 가능

그럼 가장 먼저 설치 방법부터 확인해보겠습니다.

# momentjs 설치하기

가장 먼저 momentjs를 설치하는 방법입니다. npm을 사용하여 아래와 같이 설치가 가능합니다.

이제 npm을 사용한 설치 방법이 끝났습니다. 아래처럼 import 하여 사용할 수 있습니다.

이제 설치된 moment를 다양하게 사용하는 방법과 예제를 하나 하나 알아보겠습니다.

! mementjs를 사용하여 타임스탬프 얻기, timestamp

원하는 날짜 및 시간의 타임스탬프 값을 얻을 수 있습니다. 이 때 아래와 같이 두 가지 함수를 사용합니다.
unix() // unix timestamp 값, 초 단위
valueOf() // full timestamp두 가지 모두 사용 가능하며 unix()는 초 단위의 값을 valueOf()는 밀리 세컨드 값을 반환합니다. 그럼 타임스탬프 값을 얻을 수 있는 간단한 예제를 만들어봅니다.

위와 같이 타임스탬프 값을 얻을 수 있었습니다.

! moment.js 오늘 0시 0분 값 구하기

만약 오늘 0시 0분 부터의 시간을 구하는 방법입니다. 이 경우 오늘 날짜를 입력하고 시간을 입력하지 않으면 0시 0분 기준으로 값을 얻을 수 있습니다.

@ 오늘 2020년 9월 1일 0시 0분 0초

! 이 전 시간 구하기, subtract()

moment에 subtract()를 사용하면 원하는 이 전 날짜를 가져올 수 있습니다.

moment(날짜).subtract(이전 값, 날짜기준)


날짜 기준의 값으로 년, 월, 일 또는 주(week) 및 시, 분 등도 가능합니다.

- y // 이전 연도
- M // 이전 달
- d // 이전 날짜
- h // 이전 시간
- m // 이전 분

아래는 간단한 예제입니다.

@ 7 일 전, 일 주일 전 시간 얻기

@ 한 달 전, 3개월 전 시간 얻기


여기까지 momentjs를 사용하는 방법들을 알아보았습니다.