본문 바로가기
programming/javascript

자바스크립트 날짜 메서드 사용하여 데이터 가져오기

by 개코 - 개발과 코딩 2022. 2. 25.

자바스크립트의 날짜 객체는 날짜정보 메서드를 가지고 있다. 이 메서드들을 이용하면 현재 날짜 뿐만 아니라 특정 일의 상세한 날짜 정보를 얻을 수 있다. 보통은 날짜 데이터를 특정 형태로 만들어 사용하기도 하며, 이들 메서드를 이용해 공통함수로 만들어 사용하는 경우들이 많다.

자바스크립트 날짜 메서드 사용하여 데이터 가져오기

자바스크립트에서 날짜 객체를 생성하여 날짜 정보를 가져오면 날짜의 전체정보를 GMT 그리치니 평균시 형태로 가져온다.

이 정보를 날짜 객체가 가지고 있는 메서드를 이용하면 개별로 가져올 수 있다.

날짜 객체인 Date는 년,월,일,시,분,초,밀리초 에 대한 정보를 get 형태의 메서드를 가지고 있기 때문에 이것이 가능하다.

메서드가 많기 때문에 눈으로 한번쯤 익혀두도록 하자.

날짜 메서드

자바스크립트의 날짜 객체는 날짜각 가지고 있는 모든 요소를 분해하여 값을 얻을 수 있다.

년,월,일,시,분,초,밀리초 에 대한 모든 메서드가 존재하며 현재 시간을 가져오는 속성 또한 가지고 있다.

날짜 객체가 가지고 있는 메서드의 종류는 다음과 같다.

  • getFullYear() : yyyy 형태, 년 정보를 가져온다.
  • getMonth() : 0~11 숫자, 월 정보를 가져온다.
  • getDate() : 1~31 숫자, 일 정보를 가져온다.
  • getHours() : 0~23 숫자, 시 정보를 가져온다.
  • getMinutes() : 0~59 숫자, 분 정보를 가져온다.
  • getSeconds() : 0 ~59 숫자, 초 정보를 가져온다.
  • getMilliseconds() : 0~999 숫자, 밀리초 정보를 가져온다.
  • getTime() : 1970년 1월 1일 기준부터의 밀리초 정보를 가져온다.
  • getDay() : 0~6 숫자, 요일 정보를 가져온다.
  • Date.now() : 현재 시간의 밀리초 정보를 가져온다.

샘플코드

위의 날짜 객체의 메서드를 이용하여 날짜 정보를 화면에 출력해 보는 자바스크립트 예제를 만들어 본다.

날짜 객체를 만드는 방법과 메서드는 그대로 사용한다.

<!DOCTYPE html>
<html>
    <body>

        <script>
            
            console.log('----------');

            let vDate;
            let vText;

            // 날짜객체 생성
            vDate = new Date();
            
            vText = vDate.getFullYear();
            console.log(typeof(vText), "getFullYear : ", vText);
            
            vText = vDate.getMonth();
            console.log(typeof(vText), "getMonth : ", vText);
            
            const arrMonths = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
            vText = arrMonths[vDate.getMonth()];
            console.log(typeof(vText), "getMonth index : ", vText);

            vText = vDate.getDate();
            console.log(typeof(vText), "getDate : ", vText);
            
            vText = vDate.getHours();
            console.log(typeof(vText), "getHours : ", vText);
            
            vText = vDate.getMinutes();
            console.log(typeof(vText), "getMinutes : ", vText);
            
            vText = vDate.getSeconds();
            console.log(typeof(vText), "getSeconds : ", vText);
            
            vText = vDate.getMilliseconds();
            console.log(typeof(vText), "getMilliseconds : ", vText);
            
            vText = vDate.getTime();
            console.log(typeof(vText), "getTime : ", vText);
            
            vText = vDate.getDay();
            console.log(typeof(vText), "getDay : ", vText);
            
            vText = Date.now();
            console.log(typeof(vText), "Date.now : ", vText);

            console.log('----------');
            /* */

        </script>

    </body>
</html>

코드가 길어보이지만 별 것 없다.

단지, 메서드가 많기 때문에 그렇게 보일 뿐이다.

결과 화면을 보도록 하자.

메서드의 출력형태는 모두 숫자형태임을 알 수 있다.

월 정보의 경우를 주목하자.

getMonth 메서드는 정보는 0~11까지의 숫자를 리턴한다.

즉, 1월은 0 이고 12월은 11이다.

이것을 배열로 만들어 출력한 것이다.

반응형

댓글