JS 디데이 카운트 계산

위와 같이 다음년도까지의 일 시간 분 초를 보여주는 프로그램을 짜는것이 목적입니다.

---

code

const clock = document.querySelector(".clock");

// 0d 00h 00m 00s
function getClock() {
    const nowDate = new Date();
    const nowYear = nowDate.getFullYear();
    const dDate = new Date(`${nowYear + 1}/1/1`);
    const dDay = dDate.getTime() - nowDate.getTime();
    const day = Math.floor(dDay / (1000 * 60 * 60 * 24));
    const hours = String(Math.floor((dDay % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))).padStart(2, "0");
    const minutes = String(Math.floor((dDay % (1000 * 60 * 60)) / (1000 * 60))).padStart(2, "0");
    const seconds = String(Math.floor((dDay % (1000 * 60)) / 1000)).padStart(2, "0");
    clock.innerText = `${day}d ${hours}h ${minutes}m ${seconds}s`;
}

getClock();
setInterval(getClock, 1000);

---

사용 함수

new Date()

new Date("2021/9/1"); new Date("2021 9 1"); new Date("9/1/2021");

시간정보를 받아오는 함수.
인수가 존재하지않다면 현재시간을 기준으로 받아오고
인수를 날짜 형식으로 넣으면 지정된 날짜와 시간을 기준으로 받아오게 됩니다.
인수를 받아올경우는 진짜 다양하게 넣어도 가능

---

Math.floor()

Math.floor(3.5) >> 3

소수점 이하를 버리는 함수

---

String.padStart(number, string)

const s = "1".padStart(2, "0"); >> "01" const s = "10".padStart(2, "0"); >> "10"

String의 길이가 number보다 짧다면 String 앞쪽에 string 문자를 붙여넣는다.
String의 길이가 더 길다면 무시

---

function setInterval(function, number)

function sayHello() { console.log("HELLO") } setInterval(sayHello, 5000);

주기적으로 setInterval 해당 함수를 실행시킨다.
위에 코드는 5초마다 console.log로 HELLO라는 값을 출력해라 라는 뜻이다

---

clock.innerText

<h1 class="clock> test </h1> clock.innerText = "HELLO"; <h1 class="clock> HELLO </h1>

clock이라는 코드에 text부분을 건드릴 수 있는 방법이다.
해당 내용에 접근을 해서 값을 가져올 수도있고 html을 수정할 수도 있다.

---

date.getTime()

console.log(Date.getTime()) >> N ms

new Date로 가져온 값을 기준으로 밀리초 값으로 내용을 가져온다
1000ms == 1초

---