날짜
포스트
취소

날짜

날짜 관련 기본 메소드

//현재 날짜와 시간 반환
const now = new Date();

const year = now.getFullYear(); //년도
const month = now.getMonth() + 1;  //월 (범위가 0~11라서 1을 더해줘야 한다.)
const date = now.getDate();  //날짜
const day = now.getDay();  //요일 (일→토 == 0~6)

const hours = now.getHours(); //시 (0~23)
const minutes = now.getMinutes(); //분 (0~59)
const seconds = now.getSeconds(); //초 (0~59)
const milliseconds = now.getMilliseconds(); //밀리초 (0~999)

Moment.js

  • 자바스크립트에서 Date 객체를 더 잘 다룰 수 있게 해주는 라이브러리
  • 설치
        npm install moment --save   # npm
        yarn add moment             # Yarn
        Install-Package Moment.js   # NuGet
        spm install moment --save   # spm
        meteor add momentjs:moment  # meteor
        bower install moment --save # bower (deprecated)
        
  • moment 객체의 플래그
    • overflow
      • overflow가 발생했을 때 (13월이나 32일 등을 입력했을 때)
    • invalidMonth
      • month가 유효하지 않을 때 (Jannnuaarry 등)
    • empty
      • 입력된 date가 분석 가능한 어떤 것도 포함하지 않을 때
    • nullInput
      • 입력된 date가 null일 때
    • 이외의 플래그는 링크 참고
  • 메소드
    • format(‘형식’)
      • 지정한 날짜 형식으로 변환한다.
    • isValid()
      • 해당 moment 객체의 date가 유효한지 확인한다.
    • add(수치, 항목명)
      • 지정한 항목에 입력한 수치만큼 더하기
    • subtract(수치, 항목명)
      • 지정한 항목에 입력한 수치만큼 빼기
    • fromNow()
      • moment 객체가 가지고 있는 date 정보로 부터 얼마나 시간이 흘렀는지 출력
      • 인자로 true를 넣으면 접미사가 없고, 인자가 없으면 접미사가 붙는다.
    • from(moment_객체)
      • 대상 moment 객체의 date가 인자로 넣은 moment 객체의 date와 얼마나 차이나는지를 출력
    • diff(moment_객체, 형식)
      • 두 moment 객체 간의 차이 비교
        • 사용 예시
                const dateB = moment('2014-11-11');
                const dateC = moment('2014-10-11');

                console.log('Difference is ', dateB.diff(dateC), 'milliseconds'); //인자가 없으면 기본 단위인 milliseconds 사용
                console.log('Difference is ', dateB.diff(dateC, 'days'), 'days');
                console.log('Difference is ', dateB.diff(dateC, 'months'), 'months');
                
1
2
3
4
5
6
7
8
9
10
- 날짜 비교
    - isBefore(날짜)
        - 대상 moment 객체가 가진 date가 인자로 넣은 date보다 이전이면 true 반환
    - isAfter(날짜)
        - 대상 moment 객체가 가진 date가 인자로 넣은 date보다 이후라면 true 반환
    - isAfter(날짜)
        - 대상 moment 객체가 가진 date가 인자로 넣은 date보다 같다면 true 반환
    - isLeapYear()
        - 대상 moment 객체가 가진 date가 윤년이면 true 반환 - 사용 예시
- Format Dates
        moment().format('MMMM Do YYYY, h:mm:ss a'); // 12월 22일 2023, 2:40:27 오후
        moment().format('dddd');                    // 금요일
        moment().format("MMM Do YY");               // 12월 22일 23
        moment().format('YYYY [escaped] YYYY');     // 2023 escaped 2023
        moment().format();                          // 2023-12-22T14:40:27+09:00
        
1
- Relative Time
        moment("20111031", "YYYYMMDD").fromNow(); // 12년 전
        moment("20120620", "YYYYMMDD").fromNow(); // 12년 전
        moment().startOf('day').fromNow();        // 15시간 전
        moment().endOf('day').fromNow();          // 9시간 후
        moment().startOf('hour').fromNow();       // 41분 전
        
1
- Calendar Time
        moment().subtract(10, 'days').calendar(); // 2023.12.12.
        moment().subtract(6, 'days').calendar();  // 지난주 토요일 오후 2:40
        moment().subtract(3, 'days').calendar();  // 지난주 화요일 오후 2:40
        moment().subtract(1, 'days').calendar();  // 어제 오후 2:40
        moment().calendar();                      // 오늘 오후 2:40
        moment().add(1, 'days').calendar();       // 내일 오후 2:40
        moment().add(3, 'days').calendar();       // 월요일 오후 2:40
        moment().add(10, 'days').calendar();      // 2024.01.01.
        
1
- Multiple Locale Support
        moment.locale();         // ko
        moment().format('LT');   // 오후 2:40
        moment().format('LTS');  // 오후 2:40:46
        moment().format('L');    // 2023.12.22.
        moment().format('l');    // 2023.12.22.
        moment().format('LL');   // 2023년 12월 22일
        moment().format('ll');   // 2023년 12월 22일
        moment().format('LLL');  // 2023년 12월 22일 오후 2:40
        moment().format('lll');  // 2023년 12월 22일 오후 2:40
        moment().format('LLLL'); // 2023년 12월 22일 금요일 오후 2:40
        moment().format('llll'); // 2023년 12월 22일 금요일 오후 2:40
        
이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.