연습장

24. Date 본문

JavaScript

24. Date

js0616 2024. 7. 21. 14:58

https://poiemaweb.com/js-date

 

Date | PoiemaWeb

Date 객체는 날짜와 시간을 위한 메소드를 제공하는 built-in 객체이다. 내부적으로 Date 객체는 숫자값을 갖는다. 이 값은 1970년 1월 1일 00:00(UTC)을 기점으로 현재 시간까지의 밀리초를 나타낸다.

poiemaweb.com

 

 

Date 객체

  • 날짜와 시간을 위한 메소드를 제공하는 빌트인 객체이면서 생성자 함수이다.
  • 년, 월, 일, 시, 분, 초, 밀리초(1/1000초(millisecond, ms))
  • Date 객체는 1970년 1월 1일 00:00(UTC)을 기준으로 현재 시간까지의 밀리초를 숫자값으로 갖는다.
  • 현재의 날짜와 시간은 자바스크립트 코드가 동작한 시스템의 시계에 의해 결정된다. 
  • 시스템 시계의 설정(timezone, 시간)에 따라 서로 다른 값을 가질 수 있다.
  • UTC : 협정 세계시, 원자시계
  • GMT : 그리니치 표준시, 그리니치 천문대 평균 태양 시간

 

1. Date Constructor

  • Date 객체는 생성자 함수이다. 
  • Date 생성자 함수는 날짜와 시간을 가지는 인스턴스를 생성한다. 
  • 생성된 인스턴스는 기본적으로 현재 날짜와 시간을 나타내는 값을 가진다. 
  • 현재 날짜와 시간이 아닌 다른 날짜와 시간을 다루고 싶은 경우, Date 생성자 함수에 명시적으로 해당 날짜와 시간 정보를 인수로 지정한다. 

 

Date 생성자 함수로 객체를 생성하는 방법은 4가지가 있다..?

 

1.1 new Date()
인수를 전달하지 않으면 현재 날짜와 시간을 가지는 인스턴스를 반환한다.

const date = new Date();
console.log(date); // 2024-07-21T03:43:08.831Z

 

 

  • 2024-07-21: 날짜 (년-월-일)
  • T: 시간의 시작을 나타내는 구분자
  • 03:43:08.831: 시간 (시:분:초.밀리초)
  • Z: UTC (협정 세계시)를 의미하는 표시

 

 

1.2 new Date(milliseconds)
인수로 숫자 타입의 밀리초를 전달하면 

1970년 1월 1일 00:00(UTC)을 기점으로 인수로 전달된 밀리초만큼 경과한 날짜와 시간을 가지는 인스턴스를 반환한다.

// KST(Korea Standard Time)는 GMT(그리니치 평균시: Greenwich Mean Time)에 9시간을 더한 시간이다.
let date = new Date(0);
console.log(date); // 1970-01-01T00:00:00.000Z

// 86400000ms는 1day를 의미한다.
// 1s = 1,000ms
// 1m = 60s * 1,000ms = 60,000ms
// 1h = 60m * 60,000ms = 3,600,000ms
// 1d = 24h * 3,600,000ms = 86,400,000ms
date = new Date(86400000);
console.log(date); // 1970-01-02T00:00:00.000Z

 

 

1.3 new Date(dateString)
인수로 날짜와 시간을 나타내는 문자열을 전달하면 지정된 날짜와 시간을 가지는 인스턴스를 반환한다. 

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

// UTC 기준 한국 시간보다 9시간 느리다.
let date = new Date('July 21, 2024 12:50:00');
console.log(date); // 2024-07-21T03:50:00.000Z

date = new Date('2024/07/21/12:50:00');
console.log(date); // 2024-07-21T03:50:00.000Z



1.4 new Date(year, month[, day, hour, minute, second, millisecond])
인수로 년, 월, 일, 시, 분, 초, 밀리초를 의미하는 숫자를 전달하면 지정된 날짜와 시간을 가지는 인스턴스를 반환한다. 

이때 년, 월은 반드시 지정하여야 한다. 지정하지 않은 옵션 정보는 0 또는 1으로 초기화된다.

-> 큰것부터 작아지는 순서로


년, 월을 지정하지 않은 경우 1970년 1월 1일 00:00(UTC)을 가지는 인스턴스를 반환한다.

// UTC 기준 한국 시간보다 9시간 느리다.
let date = new Date(2024, 6);
console.log(date); // 2024-06-30T15:00:00.000Z


date = new Date(2024, 6, 21, 12, 55, 0, 0);
console.log(date); // 2024-07-21T03:55:00.000Z

// 가독성이 훨씬 좋다.
date = new Date('2024/7/21/12:55:00:00');
console.log(date); // 2024-07-21T03:55:00.000Z

 


1.5 Date 생성자 함수를 new 연산자없이 호출
Date 생성자 함수를 new 연산자없이 호출하면 인스턴스를 반환하지 않고 결과값을 문자열로 반환한다.

let date = Date();
console.log(typeof date, date); // string Sun Jul 21 2024 13:00:37 GMT+0900 (대한민국 표준시)

 


 

요약

 

new Date(인수)

  • 인수 없음 : 현재 날짜와 시간
  • 밀리초 : 1970년 1월 1일 00:00 기준으로 해당 밀리초 경과
  • 날짜와 시간 : 지정된 날짜와 시간을 가지는 인스턴스를 반환
  • 년, 월[, 일, 시, 분, 초, 밀리초] :  지정된 날짜와 시간을 가지는 인스턴스를 반환 [0과 1 초기화]

 

 

UTC 협정 세계시 -> KST 한국 표준시

 

1. date.toLocaleString("ko-KR")

const date = new Date('2024/7/21/12:55:00:00');
console.log(typeof date, date) // object 2024-07-21T03:55:00.000Z

const ko_date = date.toLocaleString('ko-KR')
console.log(typeof ko_date, ko_date); // string "2024. 7. 21. 오전 12:55:00"

 

 

2. UTC 시간을 한국 표준시로 변환

const date = new Date('2024/7/21/12:55:00:00');
const koreaOffset = 9 * 60; // 한국 표준시는 UTC+9
const koreaTime = new Date(date.getTime() + (koreaOffset * 60 * 1000));
console.log(koreaTime.toISOString().replace('Z', '')); // "2024-07-21T12:55:00.000"


2. Date 메소드

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

const now = Date.now();
console.log(now); // 1721534902705


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

let d = Date.parse('Jan 2, 1970 00:00:00 UTC'); // UTC
console.log(d); // 86400000

d = Date.parse('Jan 2, 1970 09:00:00'); // KST
console.log(d); // 86400000

d = Date.parse('1970/1/2/09:00:00:00'); // KST
console.log(d); // 86400000

 

 

parse 해석 가능한 형식

 

  • ISO 8601 형식
    • 예시: '2024-07-21', '2024-07-21T12:55:00Z'
    • 설명: 날짜와 선택적으로 시간 및 시간대를 포함하는 ISO 8601 형식입니다. UTC 시간을 나타내려면 끝에 Z를 추가합니다.
  • RFC 2822 형식
    • 예시: 'Thu, 21 Jul 2024 12:55:00 +0900', '21 Jul 2024 12:55:00 +0900'
    • 설명: 이메일 헤더와 같은 형식으로 사용되는 날짜와 시간을 포함하는 문자열입니다.
  • Timestamp (Unix 시간)
    • 예시: '1626860100000'
    • 설명: 1970년 1월 1일 자정 UTC로부터의 밀리초 단위의 시간입니다.
  • 기타 형식
    • 예시: '2024/7/21', '2024-07-21 12:55:00', 'Jul 21, 2024'
    • 설명: 다양한 날짜 및 시간 형식을 인식할 수 있으며, 사용하는 JavaScript 엔진에 따라 지원되는 형식이 다를 수 있습니다.

 


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


new Date(year, month[, day, hour, minute, second, millisecond])와 같은 형식의 인수를 사용해야 한다.

Date.UTC 메소드의 인수는 local time(KST)가 아닌 UTC로 인식된다.

let d = Date.UTC(1970, 0, 2);
console.log(d); // 86400000

d = Date.UTC('1970/1/2');
console.log(d); // NaN

 

 

정리

Date.now() // 현재를 기준으로 밀리초 반환 , KST
Date.parse(날짜) // 해당 날짜를 기준으로 밀리초 반환, KST
Date.UTC(날짜)  // 해당 날짜를 기준으로 밀리초 반환, UTC


 

2.4 연 월 일 요일 시 분 초 밀리초

 

해당 날짜 객체에 대해서

 

get

  • Date.getFullYear() // 연도를 반환
  • Date.getMonth() // 월을 반환
  • Date.getDate() // 일을 반환
  • Date.getDay() // 요일을 반환
  • Date.getHours() // 시간을 반환
  • Date.getMinutes // 분을 반환
  • Date.getSeconds // 초를 반환
  • Date.getMilliseconds // 밀리초를 반환
  • Date.getTime  // 1970 ~ Date 까지의 밀리초 반환

set

  • Date.setFullYear() // 연도를 설정
  • Date.setMonth() // 월을 설정
  • Daet.setDate() // 일을 설정
  • Date.setDay() // 요일을 설정
  • Daet.setHours() // 시간을 설정
  • Date.setMinutes() // 분을 설정
  • Date.setSeconds() // 초를 설정
  • Date.setMilliseconds() // 밀리초를 설정
  • Date.setTime(time)  // 1970기준 Date를 time 만큼 설정

 

const today = new Date();

// UTC
console.log(today) // 2024-07-21T05:19:50.573Z

// KST
console.log(today.getFullYear());        // 2024
console.log(today.getMonth());           // 6
console.log(today.getDate());             // 21
console.log(today.getDay());              // 0
console.log(today.getHours());           // 14
console.log(today.getMinutes());        // 19
console.log(today.getSeconds());       // 50
console.log(today.getMilliseconds()); // 573

// 1970년 기준 현재 밀리초
console.log(today.getTime())  // 1721539190573
console.log(Date.now())         // 1721539190583

//setTime
const myday = new Date();
myday.setTime(today.getTime()) ;  // today 값
console.log(myday)                        // 2024-07-21T05:19:50.573Z



2.5 Date.prototype.getTimezoneOffset
UTC와 지정 로케일(Locale) 시간과의 차이를 분단위로 반환한다.

UTC 보다 KST가 9시간 빠르다. (60*9 = 540) 

const today = new Date();
const x = today.getTimezoneOffset(); // UTC 와 Locale 시간차이

console.log(today); // 2024-07-21T05:29:29.902Z
console.log(x);        // -540

 

2.6 
Date.prototype.toDateString // 사람이 읽을 수 있는 형식의 문자열로 날짜를 반환한다.

Date.prototype.toTimeString // 사람이 읽을 수 있는 형식의 문자열로 시간을 반환한다.

const today = new Date();

console.log(today)                         // 2024-07-21T05:35:28.986Z
console.log(today.toString());         // Sun Jul 21 2024 14:35:28 GMT+0900 (대한민국 표준시)
console.log(today.toDateString()); // Sun Jul 21 2024
console.log(today.toTimeString()); // 14:35:28 GMT+0900 (대한민국 표준시)

 


 

현재시간은?

// Date object
let today1 = new Date();
console.log(today1)   // 2024-07-21T05:55:41.679Z

// String
let today2 = Date();
console.log(today2)   // Sun Jul 21 2024 14:55:41 GMT+0900 (대한민국 표준시)

// number
let today3 = Date.now()
console.log(today3)     // 1721541341685

// 특정 밀리초 -> 날짜 형식
let today33 = new Date() // 1. Date 객체 생성
today33.setTime(today3); // 2. setTime 함수 사용
console.log(today33)     // 2024-07-21T05:55:41.685Z

 

 

 

https://chatgpt.com/

'JavaScript' 카테고리의 다른 글

26. String 레퍼 객체  (6) 2024.07.23
25. RegExp 정규표현식  (2) 2024.07.22
23. Math 수학 상수와 함수 객체  (1) 2024.07.20
22. Number 레퍼 객체  (2) 2024.07.20
21. Global Object , 전역 객체  (0) 2024.07.20