Date()
MDN: 함수로 호출할 경우 new Date().toString()과 동일하게 현재 날짜와 시간을 나타내는 문자열을 반환합니다.
*이 때 인수는 무시하고 항상 현재날짜와 시간을 나타내게 된다.
그럼 new Date() 는 무엇인가?
MDN: 생성자로 호출할 경우 새로운 Date 객체를 반환합니다.
즉, 내가 입력하는 값과 인수의 타입에 따라서 여러가지 형태로 초기화시키고 그것을 객체로 만들 수 있다!
new Date()는 현재 날짜 및 시간을 나타내는 문자열을 반환한다.
new Date()
Wed May 11 2022 11:35:05 GMT+0900 (Korean Standard Time)
인자값을 넣어주어 개별 날짜 및 시간을 객체로 생성할 수 있다.
new Date(2022,12,26,05,40,00)
Thu Jan 26 2023 05:40:00 GMT+0900 (Korean Standard Time)
new Date()의 메소드
메소드 | 역할 |
getDate | 날짜 |
getHours | 시 |
getMinutes | 분 |
getSeconds | 초 |
getDay | 요일 0(일요일)~6(토요일) |
getMonth | 월 0(1월)~11(12월) |
getFullYear | 4자리 년도 |
toString | 날짜와 시간을 문자열로 |
toTimeString | 시간만 문자열로 |
toDateString | 날짜만 문자열로 |
toLocalString | 지정된 지역에서 사용하는 날짜와 시간의 표현방식을 사용해서 문자열로 |
toLocalTimeString | 지역화된 시간 (오전/오후) hh:mm:ss |
toLocaleDateString | 지정된 지역에서 사용하는 날짜의 표현방식을 사용해서 문자열로 |
예제 살펴보기
date = new Date()
console.log(date.getFullYear())
2022
console.log(date.getDate())
11
console.log(date.getDay())
3
console.log(date.getHours())
13
getDay, getMonth의 경우 0부터 세기때문에 이를 고려해야한다.
getDay | 요일 |
0 | 일요일 |
1 | 월요일 |
2 | 화요일 |
3 | 수요일 |
4 | 목요일 |
5 | 금요일 |
6 | 토요일 |
getMonth | 월 |
0 | 1월 |
1 | 2월 |
2 | 3월 |
3 | 4월 |
4 | 5월 |
5 | 6월 |
6 | 7월 |
7 | 8월 |
8 | 9월 |
9 | 10월 |
10 | 11월 |
11 | 12월 |
toString을 사용해서 데이터 추출하기
date = new Date()
console.log(date.toString())
Wed May 11 2022 13:32:42 GMT+0900 (Korean Standard Time)
console.log(date.toDateString())
Wed May 11 2022
console.log(date.toLocaleString())
5/11/2022, 1:32:42 PM
console.log(date.toLocaleTimeString())
1:32:42 PM
console.log(date.toLocaleDateString())
5/11/2022
응용예시
<script>
const date = new Date();
const hour = date.getHours();
if (hour < 10) {
alert('아침먹을 시간입니다');
} else if (hour < 14) {
alert('점심먹을 시간입니다');
} else if (hour < 19) {
alert('저녁먹을 시간입니다');
} else {
alert('공부하세요');
}
</script>
참고하면 좋을 블로그
https://blog.munilive.com/posts/javascript-localization-with-toLocaleString.html
'Front-End Developer > JavaScript' 카테고리의 다른 글
JS 이벤트 플로우 완벽이해 (0) | 2022.05.13 |
---|---|
증감 연산자(Increment & Decrement Operators) (0) | 2022.05.11 |
if 조건문 사용해서 홀수,짝수 구해보기 (0) | 2022.05.09 |
html 안에 <script> 파일을 어디에 넣어야 할까? (0) | 2022.04.29 |
변수(Variables)란? - 변수 선언 및 할당 (0) | 2022.04.29 |