728x90
반응형
Date 객체란?
JavaScript 의 Date 객체는 1970년 1월 1일 UTC(협정 세계시) 자정과의 시간 차이를 밀리초로 나타내는 정수 값을 담음
Date 객체 만들기
new Date(milliseconds)
// 1970년 1월 1일 00:00:00 UTC + 1000ms -> 기준이 되는 시간 + 1s
let date = new Date(1000);
console.log(date); // 1970-01-01T00:00:01.000Z
// 1970년 1월 1일 00:00:00 UTC + 1000ms -> 기준이 되는 시간 + 0.5s
let date = new Date(500);
console.log(date); // 1970-01-01T00:00:01.500Z
new Date(dataString)
// new Date('YYYY-MM-DD')
let date = new Date('2024-01-05'); // 2024년 1월 5일
console.log(date); // 2024-01-05T00:00:00.000Z -> 설정 시간이 없음 00: 00: 00
//new Date('YYYY-MM-DDThh:mm:ss')
let date = new date('2024-01-05T22:22:22'); // 2024년 1월 5일 22시 00분 00초
console.log(date); // 2024-01-05T22:22:00.000Z -> 설정한 시간 정보가 들어감 22: 22: 22
new Date(YYYY, MM[, DD, hh, mm, ss, ms])
- 연도와 월까지는 필수, 나머지는 옵션
- 월은 0 부터 시작, 즉 0은 1월을 나타냄
// 2024년 1월 5일 22시 22분 22s 22ms
let date = new Date(2024, 0, 05, 22, 22, 22, 22);
console.log(date); // 2024-01-01T22:22:22.022Z
- 년도와 월까지만 쓰고 나머지 옵션 부분을 생략할 경우 -> new Date(YYYY, MM, 1, 0, 0, 0, 0) 으로 처리됨
// 2024년 1월
let date = new Date(2024, 0);
console.log(date); // 2024-01-01T00:00:00.000Z
Z는 무엇일까?👇
'Zulu time' 이라고 하며 UTC 를 표현하는 뜻
Date 객체의 형변환
let myDate = new Date('2024-1-5');
console.log(typeof myDate); // object
console.log(String(myDate)); // Fri Jan 05 2024 00:00:00 GMT+0000
console.log(Number(myDate)); // 11704412800000
console.log(Boolean(myDate)); // true
number type 으로 변환할 경우 객체끼리의 사칙연산이 가능해짐
let date1 = new Date('2024-1-4');
let date2 = new Date('2024-1-5');
let timeDiff = date2 - date1;
console.log(timeDiff); // 86400000 (ms)
console.log(timeDiff / 1000); // 86400 (sec)
console.log(timeDiff / 1000 / 60) // 1440 (min)
console.log(timeDiff / 1000 / 60 / 60) // 24 (hour)
console.log(timeDiff / 1000 / 60 / 60 / 24) // 1 (date)
Date 객체 관련 메서드
Date.now & getTime
- 1970년 1월 1일 00: 00: 00 (UTC) 를 기점으로 혅재까지 경과한 ms 를 숫자로 반환
- 메소드가 호출된 시점의 타임스템프 값을 반환
- 자료형은 number
- Date.now 와 getTime 은 같은 값
- Date.now는 새로운 객체를 만들지 않기 때문에 코드가 단순해 가독성이 높고 메모리 부담이 줄어듦 -> 특정한 시점이 아니라 단순히 그 당시 시간 값이 필요한 경우 유리
let myDate = new Date();
console.log(Date.now() === myDate.getTime()); // true
// 자료형
console.log(Date.now()); // number
console.log(date.getTime()); // number
get/set메소드
/*
getFullYear(): 연도(네 자리수)를 반환
getMonth(): 월을 반환 (1월을 나타내는 0 ~ 12월을 나타내는 11)
getDate(): 일을 반환
getHours(): 시각을 반환
getMinutes(): 분을 반환
getSeconds(): 초를 반환
getMilliseconds(): 밀리초를 반환
getDay(): 요일을 반환 (일요일을 나타내는 0 ~ 토요일을 타내는 6)
*/
/*
setFullYear(): 연도를 설정
setMonth(): 월을 설정
setDate(): 일을 설정
setHours(): 시각을 설정
setMinutes(): 분을 설정
setSeconds(): 초를 설정
setMilliseconds(): 밀리초를 설정
*/
let date = new Date(2011, 1, 1, 1, 1, 1, 1);
console.log(`${date.getFullYear()}년 ${date.getMonth()}월 ${date.getDate()}일 ${date.getHours()}시 ${date.getMinutes()}분 ${date.getSeconds()}초 ${date.getMilliseconds()}밀리초`);
// 2001년 1월 1일 1시 1분 1초 1밀리초
date.setFullYear(date.getFullYear() + 2);
date.setMonth(date.getMonth() + 2);
date.setDate(date.getDate() + 2);
date.setHours(date.getHours() + 2);
date.setMinutes(date.getMinutes() + 2);
date.setSeconds(date.getSeconds() + 2);
date.setMilliseconds(date.getMilliseconds() + 2);
console.log(`${date.getFullYear()}년 ${date.getMonth()}월 ${date.getDate()}일 ${date.getHours()}시 ${date.getMinutes()}분 ${date.getSeconds()}초 ${date.getMilliseconds()}밀리초`);
// 2003년 3월 3일 3시 3분 3초 3밀리초
자동고침 (autocorrection)
- 범위를 벗어나는 값을 설정하려고 하면 자동 고침 기능이 활성화 되어 값이 자동으로 수정됨
let date = new Date('2024-01-32');
console.log(date); // 2024년 2월 1일로 출력됨
let date = new Date('2024-01-01');
date.setDate(0); // 일의 최솟값은 1 이므로 0 을 입력하면 전 달의 마지막 날을 설정한 것과 같은 효과
console.log(date); // 2023년 12월 31일
📚References📚
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Date
Date - JavaScript | MDN
JavaScript Date 객체는 시간의 한 점을 플랫폼에 종속되지 않는 형태로 나타냅니다. Date 객체는 1970년 1월 1일 UTC(협정 세계시) 자정과의 시간 차이를 밀리초로 나타내는 정수 값을 담습니다.
developer.mozilla.org
https://ko.javascript.info/date
Date 객체와 날짜
ko.javascript.info
728x90
반응형
'웹 > JavaScript' 카테고리의 다른 글
[JavaScript] 기초 - 데이터와 형태 (0) | 2024.07.29 |
---|---|
Promise 객체 (0) | 2024.05.27 |
[JavaScript/자바스크립트] 모듈, pakage.json, pakage-lock.json (0) | 2024.05.18 |
JS 배열 Array (0) | 2024.01.05 |
JS 객체와 속성 (0) | 2024.01.04 |