CHAPTER 2 042 문자열 길이 맞추기

7792 단어 JavaScriptJavaScript

문자열.padStart(전체길이,[추가문자열])

: 문자열 시작 부분에 문자열 추가

문자열.padEnd(전체길이,[추가문자열])

: 문자열 끝 부분에 문자열 추가

예시

'5'.padStart(2, '0') //길이 2 0 추가 결과 05

[현재시각 표시]

HTML

<body>
    <span class="hour"></span> 시
    <span class="minute"></span> 분
    <span class="second"></span> 초
</body>

Javascript

// 시간
const hourElement = document.querySelector('.hour');
// 분
const minuteElement = document.querySelector('.minute');
//초
const secondElement = document.querySelector('.second');

//update 함수 실행. 
update();

// 현재시간 표기 

function update() {
    const currentTime = new Date();

    // 시간 단위 표기
    const hour = currentTime.getHours();
    hourElement.innerText = addZeroPadding(hour);

    // 분단위 표기
    const minute = currentTime.getMinutes();
    minuteElement.innerText = addZeroPadding(minute);

    //초단위 표기 
    const second = currentTime.getSeconds();
    secondElement.innerText = addZeroPadding(second);

    // 자기 자신을 불러와 update  값이 바뀔 때마다 함수가 재실행됨. 리뉴얼 계속 돼서 실시간으로 보임. 
    requestAnimationFrame(update);
}

// num 으로 시, 분, 초 모두 가져온다.
// 파라미터 num 이 10 미만의 한 자리 숫자면 앞에 0을 붙인 문자열을 반환 . 
function addZeroPadding(num) {
    return String(num).padStart(2, '0');
}

결과

[TIL]React Intro
[백준] BOJ_1920 수 찾기 JAVA

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage