JavaScript(JS) - Date

조성주·2023년 3월 6일
1

JavaScript

목록 보기
12/21
post-thumbnail

✅ Date

  • 표준 Built-in 객체로써 날짜와 시간을 위한 속성값과 메서드를 제공하는 객체이다.
  • Date객체는 1970년 1월 1일 UTC(협정 세계시) 자정과의 시간 차이를 밀리초로 나타내는 정수 값으로 표현한다.

생성자 및 대표 메서드

  1. Date 객체 생성자 - new Date()
  • Date 객체를 사용하기 위해 new연산자로 생성한다.
  • month : 1월(0) ~ 12월(11)
/* new 생성자로 Date 객체 생성 */
let date = new Date();

console.log(date) // output : 2023-03-06T10:36:39.246Z

String으로 받아 생성할 수도 있다.

/* String으로 받아 생성할 수 있다. */
let date_string = new Date("2020-01-01");

console.log(date_string) // output : 2020-01-01T00:00:00.000Z

년도, 월, 일을 따로 인자로 넣어 생성할 수 도있다. 하지만 이럴 경우 입력한 날짜보다 9시간 전 날짜가 출력이 될 것이다. 그 이유는 우리나라가 UTC기준 +9시간인 시간이기 때문에 -9시간되어 날짜가 출력이 된다.

let date_params_1 = new Date(2021, 0, 1);

console.log(date_params_1) // output : 2020-12-31T15:00:00.000Z

따라서, 이를 해결하기 위해서는 Date.UTC를 넣어 Date 객체를 생성하면 된다. Date.UTC 메서드는 UTC에 따라 지정된 날짜와 1970년 1월 1일 자정 사이의 밀리초 수를 반환한다. UTC는 세계 표준시로 설정된 시간이다.

let date_params_1 = new Date(Date.UTC(2021, 0, 1));

console.log(date_params_1); // output : 2021-01-01T00:00:00.000Z
  1. 현재 시간 기준 문자열 - Date()
  • new연산자로 Date객체를 생성한 것과 다르다. Date() 메서드는 현재 시간을 문자열로 받아오는 메서드이다.
let date = Date()

console.log(date) // output : Mon Mar 06 2023 19:36:39 GMT+0900 (대한민국 표준시)
  1. 날짜 정보 얻기(년/월/일/요일) : Date.getFullYear(), DategetMonth(), Date.getDate(), Date.getDay()
  • 요일은 일요일(0) ~ 토요일(6)으로 반환이 된다.
let date = new Date();

console.log(date) // output : 2023-03-06T10:48:25.185Z

// 날짜 정보 얻기(년)
console.log(date.getFullYear()) // output : 2023

// 날짜 정보 얻기(월)
console.log(date.getMonth()) // output : 3

// 날짜정보 얻기 (일)
console.log(date.getDate()) // output : 6

// 날짜정보 얻기(요일)
console.log(date.getDay()) // output : 1
  1. 날짜 정보 얻기(시/분/초/ms) : Date.getHours(), Date.getMinutes(), Date.getSeconds(), Date.getTimeOffset()
let date = new Date()

console.log(date) // output : 2023-03-06T11:02:01.094Z

// 날짜정보 얻기 (시)
console.log(date.getHours()) // output : 20

// 날짜정보 얻기 (분)
console.log(date.getMinutes()) // output : 1

// 날짜정보 얻기 (초)
console.log(date.getSeconds()) // output : 36

// 현재 시간을 ms로 반환
console.log(date.getTime()) // output : 1678100650512

// UTC 기준으로 현재 시간과 얼마나 차이나는지를 분으로 출력
console.log(date.getTimeOffset()) // output : -540 (= -9시간)
  1. 날짜 정보 설정(년/월/일) : Date.setFullYear(), Date.setMonth(), Date.setDate()
let date = new Date();

let ms_year = date.setFullYear(2020, 3, 15);

console.log(date) // output : 2020-04-15T11:12:05.993Z
console.log(ms_year) // output : 1586949135024

여기서 date가 2020-04-15로 나오는 이유는 date도 typeof로 확인해보면 Object(객체)로 나온다. 따라서, date또한 값 복사가 아닌 값을 가지고 있는 메모리 주소를 복사하는 것이기 때문에 얕은 복사가 되어 원본 값도 바뀌게 된다.

그리고, 월을 3으로 넣었는데 4로 출력이 되는 것은 0(1월) ~ 11(12월) 이기 때문에 4월로 출력이 된다.

  1. 날짜 정보 설정(시/분/초/ms) : Date.setHours(), Date.setMinutes(), Date.setSeconds()
let date = new Date();

setHours(시, 분, 초)
newDate.setHours(24, 20, 20); 

// 시를 20으로 했는데 11로 나온 이유는 우리나라는 UTC+9 이기 때문에 -9 한 시간이 출력이 된다.
console.log(date) // output : 2023-03-06T11:58:49.150Z

newDate.setMinutes(20)
console.log(date) // output : 2023-03-06T11:20:49.150Z

newDate.setSeconds(20)
console.log(date) // output : 2023-03-06T11:20:20.150Z
  1. 그 외 날짜 정보 설정 : Date.parse(string)
    parse
  • 날짜 정보 설정
    - 문자열 기반날짜 정보 설정 : Date.parse(YYYY-MM-DDTHH:mm:ss.sssZ)
    ... YYYY-MM-DD -> 날짜(연-월-일), "T" -> 구분 기호, HH:mm:ss.sss -> 시:분:초.밀리초
    .. 'Z'(option) -> 미 설정할 경우 현재 로컬 기준 UTC로, 설정할 경우 UTC+0 기준으로 시간 설정
// parse 날짜 정보 설정
let ms_parse = Date.parse("2022-03-31T00:00:00.000");

// 문자열 기반 날짜 정보 설정하여 출력하면 ms로 출력이 된다.
console.log(ms_parse) // output : 1648652400000

// 그걸 new Date로 생성하면 넣은 날짜가 반환된다.
console.log(new Date(ms_parse)); // output : 2022-03-30T15:00:00.000Z

Date로 걸리는 시간 구하기

//benchMark
function dateSub(old_date, new_date) {
   return new_date - old_date;
}

function getTimeSub(old_date, new_date) {
   return new_date.getTime() - old_date.getTime();
}

// 10만번 도는데 얼마나 걸리는지 시간 체크
function benchMark(callback_func) {
   let date_1 = new Date("2020-01-01");
   let date_2 = new Date();

   let start = Date.now();

   for (let i = 0; i < 100000; i++) {
   		callback_func(date_1, date_2);
    }

	return Date.now() - start;
}

console.log("dateSub : " + benchMark(dateSub) + "ms");
console.log("getTimeSub: " + benchMark(getTimeSub) + "ms");
profile
프론트엔드 개발자가 되기 위한 기록

0개의 댓글