moment.js 소개, 사용법, 그리고 심화 이해

연관글

•  2025.04.24 - [Programing/javascript] - 자바스크립트 날짜 다루기: Date vs dayjs vs date-fns

 

moment.js는 한때 자바스크립트에서 가장 널리 사용되던 날짜 및 시간 처리 라이브러리입니다. 간결하고 직관적인 API 덕분에 많은 개발자들이 사용했지만, 최근에는 파일 크기 및 성능 등의 이유로 dayjs, date-fns와 같은 대체 라이브러리로 옮겨가는 추세입니다. 그럼에도 불구하고 moment.js는 레거시 프로젝트나 일정 기능에서는 여전히 사용되기도 하므로 그 구조와 개념을 이해하는 것은 중요합니다.

---

✅ moment.js란?

• 날짜와 시간 관련 기능을 쉽게 처리할 수 있도록 설계된 JavaScript 라이브러리입니다.
• 포맷팅, 파싱, 비교, 덧셈/뺄셈 등 다양한 기능을 제공
• 체이닝 방식으로 가독성 높은 코드 작성 가능
• 단점: 불변성 없음, 파일 크기 큼 (~70KB 이상), 트리 셰이킹 불가, 타임존 처리 별도 플러그인 필요

---

📦 설치 및 기본 사용법

npm install moment

import moment from 'moment';

const now = moment();
console.log(now.format('YYYY-MM-DD HH:mm:ss'));

const future = moment().add(7, 'days');
console.log(future.format('dddd, MMMM Do YYYY'));

---

📌 주요 기능 예제

날짜 파싱과 포맷팅

const date = moment('2024-04-01', 'YYYY-MM-DD');
console.log(date.format('MMMM Do, YYYY')); // "April 1st, 2024"

날짜 간 차이 계산

const start = moment('2024-01-01');
const end = moment('2024-04-01');
console.log(end.diff(start, 'days')); // 91

날짜 유효성 검사

const valid = moment('2024-02-30', 'YYYY-MM-DD', true).isValid();
console.log(valid); // false

로케일(다국어) 설정

moment.locale('ko');
console.log(moment().format('LL')); // 2024년 4월 1일

---

🚫 왜 moment.js는 더 이상 권장되지 않을까?

• 무거운 번들 크기: 퍼포먼스에 민감한 SPA나 모바일 환경에 불리함
• 불변성 없음: 원본 객체가 수정되기 때문에 버그 발생 위험
• 모듈화 구조 부족: 불필요한 기능까지 함께 포함됨
• 공식적으로도 "새 프로젝트에서는 다른 라이브러리를 사용할 것을 권장"하고 있음 (moment 공식 문서)

---

✅ moment.js를 대체할 라이브러리?

라이브러리장점대표 문법 예시

dayjs	moment와 거의 동일한 문법, 가볍고 빠름	dayjs().format('YYYY-MM-DD')
date-fns	함수 기반, 트리 셰이킹 지원, 모듈화	format(new Date(), 'yyyy-MM-dd')

---

✨ 결론

moment.js는 오랜 시간 자바스크립트 날짜 처리의 표준으로 사용되었지만, 이제는 대체제가 존재하고 권장되는 사용 방식도 변화하고 있습니다. 하지만 기존 프로젝트를 유지하거나 moment 기반 코드를 이해할 때에는 여전히 유효한 지식이며, dayjs나 date-fns를 도입할 때도 moment.js의 경험은 도움이 됩니다.