본문 바로가기
programming/javascript

자바스크립트 날짜 표시하기 date 객체 사용 using javascript date object

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

자바스크립트는 날짜를 표시하기 위해 날짜 객체를 사용한다. 날짜 객체는 Date 객체를 사용하며 4가지 방법으로 날짜를 생성할 수 있다. 기본적으로 웹브라우저에 표시되는 날짜는 웹브라우저의 시간을 기준으로 하지만, 대부분 서버시간을 통해 웹브라우저에 표시하기도 한다.

자바스크립트 날짜 표시하기 date 객체 사용
using javascript date object

자바스크립트는 기본적으로 웹브라우저의 시간을 기준으로 한다.

자바스크립트를 기준으로 웹브라우저에서 보는 시간은 웹브라우저의 기준일 수 있다.

그렇기에 서버시간을 웹브라우저로 보내 표시하는 경우들도 있고, 동기화를 위해 별도의 작업을 처리하기도 한다.

사소한 부분일수도 있는 것이 시간관련한 것이지만 기술적으로 세세한 부분들에 많이 사용된다.

보통은 눈에 잘 보이지 않는다.

날짜 표시 방법

자바스크립트를 이용해 날짜를 화면에 표시하는 방법은 날짜 객체를 사용하는 것이다.

날짜 객체를 사용하는 방법에는 4가지 방법이 있다.

단순히 날짜 객체를 생성하는 방법도 있지만 인자값을 이용해 객체를 생성하는 방법이 있다.

날짜를 직접 작성하는 방법의 경우 일부 날짜값을 생략할 수 있지만, 순서는 년,월,일,시,분,초,밀리초 형태로 지정되어 있다.

날짜 객체를 생성하기 위해서는 new Date() 를 사용한다.

new Date();
new Date(년, 월, 일, 시, 분, 초, 밀리초);
new Date(밀리초);
new Date(날짜문자열);

샘플 코드

이제 직접 날짜 객체를 사용하여 날짜를 화면에 표시해 본다.

코드는 위의 것을 그대로 사용하고 단순히 화면에 날짜를 출력한다.

코드가 길어보이지만 new 부분이 있는 부분만 봐도 상관없다.

날짜를 표시하기 위해 Date 객체를 생성하는 것만 익혀두면 된다.

<!DOCTYPE html>
<html>
    <body>

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

            let vDate;

            // 날짜객체 생성
            vDate = new Date();
            console.log(typeof(vDate), vDate);

            // 날짜객체 생성 - 년,월,일,시,분,초,밀리초 
            vDate = new Date(2022, 01, 01, 01, 01, 01, 01);
            console.log(typeof(vDate), vDate);

            // 날짜객체 생성 - 밀리초 
            vDate = new Date(0);
            console.log(typeof(vDate), vDate);

            // 날짜객체 생성 - 밀리초 
            vDate = new Date(900000000000);
            console.log(typeof(vDate), vDate);

            // 날짜객체 생성 - 날짜문자열 
            vDate = new Date('Thu Feb 17 2022 13:13:13 GMT+0900');
            console.log(typeof(vDate), vDate);

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

        </script>

    </body>
</html>

결과화면을 보자.

날짜 객체를 이용하여 화면에 날짜를 표시했다.

하지만, 포맷이나 그것 등은 고려하지 않았기 때문에 영어권 사람들이 보기 좋아하는 형태로 표시되고 있다.

어쨌든 날짜 객체인 Date 객체를 이용하여 날짜를 출력할 수 있다.

반응형

댓글