2024. 05. 06 (월) 2주차 - Daily Coding - Day08

TO-DO-LIST

🔳 Date 객체

🔳 javascript 시간/문자열

---

 

🔳 Date 객체

본 내용을 시작하기 전에 Date 객체에 대해서 먼저 정리하겠습니다.

1. 자바스크립트는 Date 객체를 사용해서 날짜와 시간을 표현한다.
2. Date 객체는 반드시 '날짜'와 '시간'을 모두 포함하고, 날짜와 시간을 따로 저장하는 방식은 불가능하다.
3. Date 형식은 [Thu May 19 2022 18:11:13 GMT+0900 (한국 표준시)](예시)이다.
4. 월은 [0 ~ 11] 인덱스 사용 : 0 = 1월 / 11 = 12월
5. 요일은 [0 ~ 6] 인덱스 사용 : 0 = 일요일 / 6은 토요일
6. 요일 데이터를 작성할 수 있는 방법은 없다. 해당 날짜 요일을 자동으로 출력한다.
7. UTC는 1970년 1월 1일 00시 00분 00초이다.
8. javascript의 타임스탬프는 밀리초가 기준이다.
   (new Date()를 사용하여 Date 객체를 생성한다.)

javascript 함수명		의미
getFullYear()	연도
getMonth()	월	0 ~ 11 / 1월 ~ 12월
getDate()	일
getDay()	요일	0 ~6 / 일 ~ 토
getHours()	시
getMinutes()	분
getSeconds()	초
getMilliseconds()	밀리초

 

🔳 javascript 시간/문자열

     - setInterval : 주기적으로 시간을 호출하는 함수

     - setTimeout : 1회성 호출 함수

     - .toString : 숫자열을 문자열로 바꿔줌

     - .padStart : 문자열을 원하는 길이로 채워줌

        ex) .padStart(채울길이, 채울문자)

 

function setTime() {

    const time = new Date ();
    const year = time.getFullYear();
    const month = time.getMonth()+1;
    const date = time.getDate();
    const hour = time.getHours().toString().padStart(2,'0');
    const min = time.getMinutes().toString().padStart(2,'0');
    const sec = time.getSeconds().toString().padStart(2,'0');
    const timeH1 = document.querySelector('.timer');

    timeH1.innerText = `${year}년${month}월${date}일, ${hour}시${min}분${sec}초`;
}

setInterval(setTime, 1000);

 

 

 

아.. 자바스크립드 진짜 너무 어렵다... 한숨 가득~~~