- 학습일 : 2024.02.01
- 참고 URL
학습 내용
- 자바스크립트에선 Date 객체를 사용해 날짜와 시간을 나타냅니다.
Date객체엔 ‘날짜만’ 혹은 ‘시간만’ 저장하는 것은 불가능하고, 항상 날짜와 시간이 함께 저장됩니다. - 월은 0부터 시작합니다(0은 1월을 나타냅니다).
- 요일은
getDay()를 사용하면 얻을 수 있는데, 요일 역시 0부터 시작합니다(0은 일요일을 나타냅니다). - 범위를 넘어가는 구성요소를 설정하려 할 때
Date자동 고침이 활성화됩니다. 이를 이용하면 월/일/시간을 쉽게 날짜에 추가하거나 뺄 수 있습니다. - 날짜끼리 빼는 것도 가능한데, 이때 두 날짜의 밀리초 차이가 반환됩니다. 이게 가능한 이유는
Date가 숫자형으로 바뀔 때 타임스탬프가 반환되기 때문입니다. Date.now()를 사용하면 현재 시각의 타임스탬프를 빠르게 구할 수 있습니다.
자바스크립트의 타임스탬프는 초가 아닌 밀리초 기준이라는 점을 항상 유의하시기 바랍니다.
간혹 밀리초보다 더 정확한 시간 측정이 필요할 때가 있습니다. 자바스크립트는 마이크로초(1/1,000,000초)를 지원하진 않지만 대다수의 호스트 환경은 마이크로초를 지원합니다. 브라우저 환경의 메서드 performance.now()는 페이지 로딩에 걸리는 밀리초를 반환해주는데, 반환되는 숫자는 소수점 아래 세 자리까지 지원합니다.
alert(페이지 로딩이 ${performance.now()}밀리초 전에 시작되었습니다.);// 얼럿 창에 "페이지 로딩이 34731.26000000001밀리초 전에 시작되었습니다."와 유사한 메시지가 뜰 텐데// 여기서 '.26'은 마이크로초(260마이크로초)를 나타냅니다.// 소수점 아래 숫자 세 개 이후의 숫자는 정밀도 에러때문에 보이는 숫자이므로 소수점 아래 숫자 세 개만 유효합니다.
Node.js에선 microtime 모듈 등을 사용해 마이크로초를 사용할 수 있습니다. 자바스크립트가 구동되는 대다수의 호스트 환경과 기기에서 마이크로초를 지원하고 있는데 Date 객체만 마이크로초를 지원하지 않습니다.
실습 코드
/* 객체 생성하기 */
let now = new Date();
console.log( now ); // 현재 날짜 및 시간이 출력됨 -> 2024-02-01T14:23:07.438Z
/* getFullYear() vs getYear() */
console.log( now.getFullYear() ); // 2024
// getYear() - 비지원 메소드
console.log( now.getYear() ); // 124 -> 이런 이유로 getYear()은 사용하면 안됨
/* Date.now() */
let start = Date.now(); // 1970년 1월 1일부터 현재까지의 밀리초
// 원하는 작업을 수행
for (let i = 0; i < 100000; i++) {
let doSomething = i * i * i;
}
let end = Date.now(); // done
// Date 객체가 아닌 숫자끼리 차감함
console.log( `반복문을 모두 도는데 ${end - start} 밀리초가 걸렸습니다.` ); // 반복문을 모두 도는데 6 밀리초가 걸렸습니다.
/* Date.parse와 문자열 */
let ms = Date.parse('2012-01-26T13:51:50.417-07:00');
console.log(ms); // 1327611110417 (타임스탬프)과제
→ 1번
/* 날짜 생성하기
2012년 2월 20일, 오전 3시 12분을 나타내는 Date 객체를 만들어보세요(시간대는 로컬).
그리고 console.log 함수를 이용해 생성한 객체를 출력하세요.
*/
// 내 풀이(=정답)
let dt = new Date(2012, 1, 21, 3, 12);
console.log(dt);
console.log(dt.getD);→ 2번
/* 요일 보여주기
날짜를 입력하면 ‘MO’, ‘TU’, ‘WE’, ‘TH’, ‘FR’, ‘SA’, ‘SU’ 형식으로
요일을 보여주는 함수 getWeekDay(date)를 만들어보세요.
let date = new Date(2012, 0, 3); // 2012년 1월 3일
console.log( getWeekDay(date) ); // "TU"가 출력되어야 합니다.
*/
// 해답
function getWeekDay(date) {
let days = ['SU', 'MO', 'TU', 'WE', 'TH', 'FR', 'SA'];
return days[date.getDay()];
}
let date = new Date(2014, 0, 3); // 2014년 1월 3일
console.log( getWeekDay(date) ); // FR- 나였으면 if문을 썼을 것 같은데, 해답 코드에서는 배열로 처리를 했다.
- 만약, if문을 썼다면 if-else if-else 를 사용하여 7줄 이상을 사용했을 것이다. 하지만, 배열로 사용하니 1줄만에 끝났다. 앞으로는 이 방식을 사용하게 됐다.
→ 3번
/* 유럽 기준 달력
유럽국가의 달력은 월요일부터 시작합니다(월요일-1, 화요일-2, … 일요일-7).
‘유럽’ 기준 숫자를 반환해주는 함수 getLocalDay(date)를 만들어보세요.
let date = new Date(2019, 11, 5); // 2019년 11월 5일
alert( getLocalDay(date) ); // 금요일이므로, 5가 출력되어야 함
*/
// 내 풀이
function getLocalDay(date){
let day = [1, 2, 3, 4, 5, 6, 7];
return day[date.getDay()];
}
let date = new Date(2019, 11, 5); // 2019년 11월 5일
console.log( getLocalDay(date) ); // 금요일이므로, 5가 출력되어야 함
// 해답 코드
function getLocalDay(date) {
let day = date.getDay();
if (day == 0) { // 일요일(숫자 0)은 유럽에선 7입니다.
day = 7;
}
return day;
}→ 4번
/* n일 전 '일' 출력하기
date를 기준으로 days일 전 '일’을 반환하는 함수 getDateAgo(date, days)를 만들어보세요,
오늘이 20일이라면 getDateAgo(new Date(), 1)는 19를, getDateAgo(new Date(), 2)는 18을 반환해야 합니다.
days가 365일 때도 제대로 동작해야 합니다.
let date = new Date(2015, 0, 2); // 2015년 1월 2일
console.log( getDateAgo(date, 1) ); // 1, (2015년 1월 1일)
console.log( getDateAgo(date, 2) ); // 31, (2014년 12월 31일)
console.log( getDateAgo(date, 365) ); // 2, (2014년 1월 2일)
주의: 함수는 date를 변경하지 않아야 합니다.
*/
// 해답 코드
function getDateAgo(date, days) {
let dateCopy = new Date(date);
dateCopy.setDate(date.getDate() - days);
return dateCopy.getDate();
}
let date = new Date(2015, 0, 2); // 2015년 1월 2일
console.log( getDateAgo(date, 1) ); // 1, (2015년 1월 1일)
console.log( getDateAgo(date, 2) ); // 31, (2014년 12월 31일)
console.log( getDateAgo(date, 365) ); // 2, (2014년 1월 2일)
#Software Engineer #IRISH