JS (30) - Date

Date
표준 빌트인 객체로, 날짜와 시간(연, 월, 일, 시, 분, 초, 밀리초)을 위한 메서드를 제공

Date 생성자 함수

• Date는 생성자 함수로,
  Date 생성자 함수가 생성한 Date객체는 기본적으로 현재 날짜와 시간을 나타내는 정수값을 가짐

1) new Date()

• Date 생성자 함수를 인수 없이 new 연산자와 함께 호출하면 현재 날짜와 시간을 가지는 Date 객체 반환

new Date();		// Wed Aug 03 2022 12:45:38 GMT+0900 (한국 표준시)

• Date 생성자 함수를 new 연산자 없이 호출하면 Date객체를 반환하지 않고 날짜와 시간 정보를 나타내는 문자열 반환

Date();		// 'Wed Aug 03 2022 12:46:41 GMT+0900 (한국 표준시)'

2) new Date(milliseconds)

• Date 생성자 함수에 숫자 타입의 밀리초를 인수로 전달하면 1970년 1월 1일 00:00:00(UTC)을 기점으로 인수로 전달된 밀리초만큼 경과한 날짜와 시간을 나타내는 Date객체 반환

new Date(0);		// Thu Jan 01 1970 09:00:00 GMT+0900 (한국 표준시)

new Date(86400000);	// Fri Jan 02 1970 09:00:00 GMT+0900 (한국 표준시)

3) new Date(dateString)

• Date 생성자 함수에 날짜와 시간을 나타내는 문자열을 인수로 전달하면 지정된 날짜와 시간을 나타내는 Date객체 반환

• 이때 인수로 전달된 문자열은 Date.parse 메서드에 의해 해석 가능한 형식이어야 함

new Date('May 26, 2020 10:00:00');	// Tue May 26 2020 10:00:00 GMT+0900 (한국 표준시)

new Date('2020/03/26/10:00:00');	// Thu Mar 26 2020 10:00:00 GMT+0900 (한국 표준시)

4) new Date(year, month[, day, hour, minute, second, millisecond])

• Date 생성자 함수에 연, 월, 일, 시, 분, 초, 밀리초를 의미하는 숫자를 인수로 전달하면 지정된 날짜와 시간을 나타내는 Date 객체 반환

  • 연, 월은 반드시 지정해야 함
    • 연, 월을 지정하지 않은 경우 1970년 1월 1일 00:00:00을 나타내는 Date객체 반환
  • 지정하지 않은 옵션 정보는 0 또는 1로 초기화

• 인수
  

인수	내용
year	연을 나타내는 1900년 이후의 정수. 0부터 99는 1900부터 1999로 처리
month	월을 나타내는 0 ~ 11까지의 정수 (※ 0부터 시작, 0 == 1월)
day	일을 나타내는 1 ~ 31까지의 정수
hour	시를 나타내는 0 ~ 23까지의 정수
minute	분을 나타내는 0 ~ 59까지의 정수
second	초를 나타내는 0 ~ 59까지의 정수
millisecond	밀리초를 나타내는 0 ~ 999까지의 정수

---

Date 메서드

1) Date.now

1970년 1월 1일 00:00:00(UTC) 기점으로 현재 시간까지 경과한 밀리초를 숫자로 반환

2) Date.parse

1970년 1월 1일 00:00:00(UTC) 기점으로 인수로 전달된 지정 시간(new Date(dateString)의 인수와 동일한 형식)까지의 밀리초를 숫자로 반환

3) Date.UTC

1970년 1월 1일 00:00:00(UTC)을 기점으로 인수로 전달된 지정 시간까지의 밀리초를 숫자로 반환

• Date.UTC 메서드는 new Date(year, month[, day, hour, minute, second, millisecond])와 같은 형식의 인수 사용

• Date.UTC 메서드의 인수는 로컬타임(KST)이 아닌 UTC로 인식

4) Date.prototype.getFullYear

Date 객체의 연도를 나타내는 정수 반환

5) Date.prototype.setFullYear

Date 객체의 연도를 나타내는 정수를 설정

• 연도 이외에 옵션으로 월, 일도 설정할 수 있음

const today = new Date();

today.setFullYear(2000);
today.getFullYear();		// 2000

today.setFullYear(1900, 0, 1);
today.getFullYear();		// 1900

6) Date.prototype.getMonth

Date 객체의 월을 나타내는 0~11의 정수 반환

• 1월은 0, 12월은 11

7) Date.prototype.setMonth

Date 객체의 월을 나타내는 0~11의 정수를 설정

• 1월은 0, 12월은 11

• 월 이외에도 옵션으로 일도 설정할 수 있음

const today = new Date();

today.setMonth(0);
today.getMonth();		// 0

today.setMonth(11, 1);
today.getMonth();		// 11

8) Date.prototype.getDate

Date 객체의 날짜(1 ~ 31)를 나타내는 정수를 반환

9) Date.prototype.setDate

Date 객체의 날짜(1 ~ 31)를 나타내는 정수를 설정

const today = new Date();

today.setDate(1);
today.getDate();		// 1

10) Date.prototype.getDay

Date 객체의 요일(0 ~ 6)를 나타내는 정수를 반환

요일	반환값
일요일	0
월요일	1
화요일	2
수요일	3
목요일	4
금요일	5
토요일	6

11) Date.prototype.getHours

Date 객체의 시간(0 ~ 23)를 나타내는 정수 반환

12) Date.prototype.setHours

Date 객체의 시간(0 ~ 23)를 나타내는 정수 설정

• 시간 이외에 옵션으로 분, 초, 밀리초도 설정할 수 있음

const today = new Date();

today.setHours(7);
today.getHours();	// 7

today.setHours(0, 0, 0, 0);	// 00:00:00:00
today.getHours();			// 0

13) Date.prototype.getMinutes

Date 객체의 분(0 ~ 59)를 나타내는 정수 반환

14) Date.prototype.setMinutes

Date 객체의 분(0 ~ 59)를 나타내는 정수 설정

• 분 이외에 옵션으로 초, 밀리초도 설정할 수 있음

const today = new Date();

today.setMinutes(50);
today.getMinutes();		// 50

today.setMinutes(5, 10, 999);	// HH:05:10:999
today.getMinutes();				// 5

15) Date.prototype.getSeconds

Date 객체의 초(0 ~ 59)를 나타내는 정수 반환

16) Date.prototype.setSeconds

Date 객체의 초(0 ~ 59)를 나타내는 정수 설정

• 초 이외에 옵션으로 밀리초도 설정할 수 있음

const today = new Date();

today.setSeconds(30);
today.getSeconds();		// 30

today.setSeconds(10, 0);	// HH:MM:10:000
today.getSeconds();			// 10

17) Date.prototype.getMilliseconds

Date 객체의 밀리초(0 ~ 999)를 나타내는 정수 반환

18) Date.prototype.setMilliseconds

Date 객체의 밀리초(0 ~ 999)를 나타내는 정수 설정

const today = new Date();

today.setMilliseconds(123);	
today.getMilliseconds();	// 123

19) Date.prototype.getTime

1970년 1월 1일 00:00:00(UTC)를 기점으로 Date 객체의 시간까지 경과된 밀리초를 반환

20) Date.prototype.setTime

Date 객체에 1970년 1월 1일 00:00:00(UTC)를 기점으로 경과된 밀리초를 설정

21) Date.prototype.getTimezoneOffset

UTC와 Date 객체에 지정된 로캘 시간과의 차이를 분 단위로 반환

• KST는 UTC에 9시간을 더한 시간
  • UTC = KST - 9h

const today = new Date();

today.getTimezoneOffset() / 60;		// 9

22) Date.prototype.toDateString

사람이 읽을 수 있는 형식의 문자열로 Date 객체의 날짜를 반환

const today = new Date('2020/7/24/12:30');

today.toDateString();		// 'Fri Jul 24 2020'

23) Date.prototype.toTimeString

사람이 읽을 수 있는 형식으로 Date 객체의 시간을 표현한 문자열을 반환

const today = new Date('2020/7/24/12:30');

today.toTimeString();		// '12:30:00 GMT+0900 (한국 표준시)'

24) Date.prototype.toISOString

ISO 8601 형식으로 Date 객체의 날짜와 시간을 표현한 문자열 반환

const today = new Date('2020/7/24/12:30');

today.toISOString();		// '2020-07-24T03:30:00.000Z'

today.toISOString().slice(0, 10);					// '2020-07-24'
today.toISOString().slice(0, 10).replace(/-/g, '');	// '20200724'

25) Date.prototype.toLocaleString

인수로 전달한 로캘을 기준으로 Date 객체의 날짜와 시간을 표현한 문자열 반환

• 인수를 생략한 경우 브라우저가 동작 중인 시스템의 로캘을 적용

26) Date.prototype.toLocalTimeString

인수로 전달한 로캘을 기준으로 Date 객체의 시간을 표현한 문자열 반환

• 인수를 생략한 경우 브라우저가 동작 중인 시스템의 로캘을 적용

const today = new Date('2020/7/24/12:30');

today.toString();			// 'Fri Jul 24 2020 12:30:00 GMT+0900 (한국 표준시)'

today.toLocaleString();		// '2020. 7. 24. 오후 12:30:00'
today.toLocaleString('ko-KR');	// '2020. 7. 24. 오후 12:30:00'
today.toLocaleString('en-US');	// '7/24/2020, 12:30:00 PM'
today.toLocaleString('ja-JP');	// '2020/7/24 12:30:00'

today.toLocaleTimeString();			// '오후 12:30:00'
today.toLocaleTimeString('ko-KR');	// '오후 12:30:00'
today.toLocaleTimeString('en-US');	// '12:30:00 PM'
today.toLocaleTimeString('ja-JP');	// '12:30:00'

---

Date 예제

(function printNow() {
  const today = new Date();
  
  const dayNames = [
    '(일요일)',
    '(월요일)', 
    '(화요일)',
    '(수요일)', 
    '(목요일)', 
    '(금요일)', 
    '(토요일)'
  ];
  
  const day = dayNames[today.getDay()];
  
  const year = today.getFullYear();
  const month = today.getMonth() + 1;
  const date = today.getDate();
  let hour = today.getHours();
  let minute = today.getMinutes();
  let second = today.getSeconds();
  const ampm = hour >= 12 ? 'PM' : 'AM';
  
  hour %= 12;
  hour = hour || 12;
  
  minute = minute < 10 ? '0' + minute : minute;
  second = second < 10 ? '0' + second : second;
  
  const now = `${year}년 ${month}월 ${date}일 ${day} ${hour}:${minute}:${second} ${ampm}`
  
  console.log(now);
  
  setTimeout(printNow, 100);
}());