박시은

(❁´◡`❁)

2 분 소요


  • js 내장 객체 중에서 Data 객체는 날짜와 시간에 대한 정보를 조절할 수 있는 객체이다.
  • 현재 날짜와 시간을 홈페이지에 출력하거나 달력을 표시할 수 있고, 특정까지 얼마나 남았는지 세는 등 여러가지로 응용이 가능하다.


▶ js 객체의 인스턴트 만들기

  • Data 객체 등 js에 정의된 내장 객체를 사용하려면 js의 Date 객체를 똑같이 만들어서 사용하는데, 이렇게 내장 객체와 똑같은 모양으로 찍어내는 것을 인스턴스라고 한다.


▷ 현재 날짜를 기준으로 인스턴스 만들기

  • 시간을 제어하는 프로그램을 작성하려면 가장 먼저 날짜나 시간 정보를 가지고 있는 Data 객체의 인스턴스를 만들고 변수에 저장해야한다.
  • 기본형 : new Date()
// console
const today = new Date();
console.log(today);


today 변수에는 Date 객체의 인스턴스가 저장되었으므로 이제부터 today 변수는 Date 객체의 프로퍼티와 메서드를 사용할 수 있다.

Date 객체의 오늘 날짜를 확인하는 getDate() 메서드를 사용해보자.

// console
today.getDate();


▷ 특정 날짜를 기준으로 인스턴스 만들기

특정 날짜를 저장한 Date 객체를 만들려면 Date 다음 소괄호에 날짜 정보를 입력하면 딘다.

new Date("2002-05-07"); // 2002년 5월 7일
new Date(2002, 5, 7); // 2002년 5월 7일


시간 정보까지 함께 지정하려면 날짜 다음에 대문자 T를 추가한 후 그 뒤에 시간을 입력하면 된다.

new Date("2002-05-07T14:04:15");


▷ js 날짜와 입력방식

  • 날짜와 시간을 지정해 Date 객체를 만들 땐 js가 인식할 수 있는 형식에 맞춰 날짜와 시간 정보를 입력해야 한다.
  • 형식 : YYYY : 연도 / MM : 월 / DD : 일 / HH : 시 / SS : 초
  1. YYYY-MM-DD 형식
new Date("2002-05-07");
new Date("2002-07");
new Date("2002");


  1. YYYY-MM-DDTHH:MM:SS 형식
new Date("2002-05-07T14:04:15");


  1. DD/MM/YYYY
new Date("07-05-2002");


  1. 전체형식
new Date("Thu Aug 03 2023 00:24:32 GMT+0900 (한국 표준시)");



▶ Date 객체의 메서드

  • Date 객체의 인스턴스를 만들었으면 Date 객체의 메서드를 사용해서 날짜/시간 정보를 프로그램에 사용할 수 있다.
  • Date 객체의 메서드는 get(시간이나 날짜 알아내는 메서드), set(시간과 날짜 원하는대로 설정하는 메서드), to(국제 표준 형식으로 된 날짜 표시를 다른 형식으로 바꿔주는 메서드)로 크게 세 가지로 나눌 수 있다.


▷ 날짜와 시간의 정보를 가져오는 메서드

메서드 설명
getFullYear( ) 현재 시간을 기준으로 연도값을 가져온다
getMonth( ) 월값을 가져온다. (0~11 (0은 1월, 11은 12월))
getDate( ) 일값을 가져온다. (1~31)
getDay( ) 요일값을 가져온다. (0~6 (0은 일요일, 6은 토요일))
getTime( ) 1970년 1월 1일 00:00 이후의 시간을 밀리초로 표시한다.
getHours( ) 시 값을 가져온다. (0~23)
getMinutes( ) 분 값을 가져온다. (0~59)
getSeconds( ) 초 값을 가져온다. (0~59)
getMilliseconds( ) 밀리초 값을 가져온다. (0~999)
setFullYear( ) 현지 시간을 기준으로 연도를 설정한다.
setMonth( ) 현지 시간을 기준으로 월을 설정한다.
setDate( ) 현지 시간을 기준으로 일을 설정한다.
setTime( ) 1970년 1월 1일 00:00부터 지난 시간을 밀리초로 표시한다.
setHours( ) 현지 시간을 기준으로 시를 설정한다.
setMinutes( ) 현지 시간을 기준으로 분을 설정한다.
setSeconds( ) 현지 시간을 기준으로 초를 설정한다.
setMilliseconds( ) 현지 시간을 기준으로 밀리초를 설정한다.


▷ 날짜와 시간의 형식을 바꾸는 메서드

메서드 설명
toUTCstring( ) “요일 일 월 연도 시:분:초 UTC” 형식으로 표시한다.
toLocaleString( ) “월/일/연도 시:분:초” 형식으로 표시한다.
toString( ) “요일 일 월 연도 시:분:초 UTC+대한민국 표준시” 형식으로 표시한다.
toDateString( ) Date에서 날짜 부분만 표시한다.
toTimeString( ) Date에서 시간 부분만 표시한다.



▶ 📎참조

Doit! 모던 자바스크립트 프로그래밍의 정석

댓글남기기

참고