< Clocks >

PadStart

padStart, padEnd

글자 길이를 채우는 함수이다.
padStart는 글자 앞쪽에 문자를 추가하여 문자열의 길이를 원하는대로 맞추고, padEnd는 글자 뒷쪽에 문자를 추가한다.

//ex)
"1".padStart(2,"0") //"01"
"1".padEnd(3,"0")//"100"

시계를 만들 때 글자가 두개씩 출력되게 만들고 싶다면,

//clock.js
function getClock(){
  //...
  const hour = String(date.getHours()).padStart(2, "0");
  const minute = String(date.getMinutes()).padStart(2,"0");
  const second = String(date.getSeconds()).padStart(2,"0");
  clock.innerText = `${hour}:${minute}:${second}`;
}

< Quotes >

명언 랜덤 추출

Math 관련 함수

random

0에서 1 사이의 랜덤한 값을 제공한다.
랜덤한 정수를 얻기 위해서는 (원하는 수)만큼을 곱해주고 소숫점 아래는 떼어주면 된다.
소수점 아랫부분을 없애주기 위해서는 다음과 같은 함수들을 사용할 수 있다.

round

숫자를 반올림하여 정수로 반환한다.

ceil

숫자를 천장(ceil)까지 높여준다. 숫자를 올림하여 반환한다는 의미이다.

floor

숫자를 바닥(floor)까지 내려준다. 숫자를 내림하여 반환한다는 의미이다.

명언 배열에서 랜덤한 명언 추출하기

<!--index.html-->
<div id="quote">
  <span></span>
  <span></span>
</div>

//quotes.js
const quotes=[
  {//quote, author
  },
  //...
]
const quote = document.querySelector("#quote span:first-child");
const author = document.querySelector("#quote span:last-child");

console.log(quotes[Math.floor(Math.random()*quotes.length)]);

명언 화면에 띄우기

//quotes.js
//...
const todaysQuote = quotes[Math.floor(Math.random()*quotes.length)];
quote.innerText = todaysQuote.quote;
author.innerText = todaysQuote.author;