'javascript시간라이브러리'에 해당되는 글 1건

  1. 2020.11.15 [javascript] moment.js 적용하기
JavaScript2020. 11. 15. 22:01

 

 

 

moment.js는 일단 요약하자면 날짜 활용 라이브러리다.

날짜/시간과 관련된 기능들을 다룰일이 플젝 진행시에 굉장히 많을것인데...

자바스크립트에 있는 Date 객체도 함께 활용하며 날짜/시간 관련된 공통 함수를 활용하는데 매우 편리하게 해준다.

알아보니, 언어 로케이션 지원도 꽤 잘되어있다.

오픈소스, 달력 관련 라이브러리에서 매우 많이 활용한다고 한다.

공식홈페이지 : https://momentjs.com/

 

API : https://momentjs.com/docs/

 

 

 

생성자로 아무것도 안받을수도 있고(이 경우에는 현재 시간 기준으로 function 동작)

Date 객체 혹은 밀리초 값을 받을수도 있다.

문자열로 된 날짜도 가능하다.

활용 예)

 

<script language="javascript">
$(document).ready(function(){
    // 공식 홈페이지에도 활용 예가 잘 나와있다.
    // 현재 시각은 2020년 08월 27일 대략 오후 17시 조금 넘었다...
    // 작성하다보니 시간이 계속 가서...ㅋ.ㅋ
    // 예제별로 가리키는 시간이 약~간 다를 수 있다.

    //Format Dates
    console.log(moment().format());
	console.log(moment().format('MMMM Do YYYY, h:mm:ss a')); // August 27th 2020, 4:59:28 pm
	console.log(moment().format('dddd'));                    // Thursday
	console.log(moment().format("MMM Do YY"));               // Aug 27th 20
	console.log(moment().format('YYYY [escaped] YYYY'));     // 2020 escaped 2020
	
    //Relative Date
	console.log(moment("20111031", "YYYYMMDD").fromNow()); // 9 years ago
	console.log(moment("20120620", "YYYYMMDD").fromNow()); // 8 years ago
	console.log(moment().startOf('day').fromNow());        // 17 hours ago
	console.log(moment().endOf('day').fromNow());          // in 7 hours
	console.log(moment().startOf('hour').fromNow());       // 4 minutes ago 
    
    //Calendar Date
    console.log(moment().subtract(10, 'days').calendar()); // 08/17/2020
	console.log(moment().subtract(6, 'days').calendar());  // Last Friday at 5:14 PM
	console.log(moment().subtract(3, 'days').calendar());  // Last Monday at 5:14 PM
	console.log(moment().subtract(1, 'days').calendar());  // Yesterday at 5:14 PM
	console.log(moment().calendar());                      // Today at 5:14 PM
	console.log(moment().add(1, 'days').calendar());       // Tomorrow at 5:14 PM
	console.log(moment().add(3, 'days').calendar());       // Sunday at 5:14 PM
	console.log(moment().add(10, 'days').calendar());      // 09/06/2020

    //Multiple Locale support
    console.log(moment.locale());         // en
	console.log(moment().format('LT'));   // 5:20 PM
	console.log(moment().format('LTS'));  // 5:20:06 PM
	console.log(moment().format('L'));    // 08/27/2020
	console.log(moment().format('l'));    // 8/27/2020
	console.log(moment().format('LL'));   // August 27, 2020
	console.log(moment().format('ll'));   // Aug 27, 2020
	console.log(moment().format('LLL'));  // August 27, 2020 5:20 PM
	console.log(moment().format('lll'));  // Aug 27, 2020 5:20 PM
	console.log(moment().format('LLLL')); // Thursday, August 27, 2020 5:20 PM
	console.log(moment().format('llll')); // Thu, Aug 27, 2020 5:20 PM

    //날짜 더하기 (add 함수)
    var date = new Date();
    console.log(moment(date.getTime()).add("-1", "y").format("YYYY/MM/DD")); //1년 전
    console.log(moment(date.getTime()).add("1", "M").format("YYYY/MM/DD")); //1개월 후
    console.log(moment(date.getTime()).add("2", "d").format("YYYY/MM/DD")); //2일 후
    console.log(moment(date.getTime()).add("-3", "h").format("HH시 mm분 ss초")); //3시간 전
    console.log(moment(date.getTime()).add("4", "m").format("HH시 mm분 ss초")); //4분 후
    console.log(moment(date.getTime()).add("-5", "s").format("HH시 mm분 ss초")); //5초 전

    //날짜차이 구하기
    var a = moment(date);
    var b = a.clone().add('-1', 'M');
    console.log(a.format("YYYY.MM.DD"));
    console.log(b.format("YYYY.MM.DD"));
    console.log(a.diff(b, 'days')); //일 단위로 날짜 차이 계산
    console.log(a.diff(b, 'weeks')); //주 단위로 날짜 차이 계산
    console.log(a.diff(b, 'months')); //월 단위로 날짜 차이 계산
    console.log(a.diff(b, 'years', true)); //연 단위로 날짜 차이 계산

});
...

 

 

 

Posted by 사슴영혼'-'