타이머함수
함수명 | 설명 |
setTimeout(function, millisecond) | 일정 시간이 지난 후 함수를 한번 실행한다. |
clearTimeout(id) | 일정 시간이 지난 후 함수를 한 번 실행하는 것을 중지한다. |
setInterval(function, millisecond) | 일정 시간마다 함수를 반복해서 시행한다. |
clearInterval(id) | 일정 시간마다 함수를 반복하는 것을 중단한다. |
See the Pen setTimeout by coding-ji (@coding-ji) on CodePen.
위의 예제에서 let val1 = setTimeout(writeHello, 1000);으로 설정하고 clearTimeout(val1);을 시행하면 setTimeout이 시행되지 않는 모습을 볼 수 있다.
<<clearTimeout 예제>>
더보기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function writeHello(){
let text = document.createElement("p");
text.textContent = "안녕하세요"
document.body.append(text);
}
let val1 = setTimeout(writeHello, 1000);
clearTimeout(val1);
</script>
</body>
</html>
아래의 예제는 setInterval함수를 사용해서 1초마다 함수를 반복해서 시행한 예제이다. 아래 코드에서 clearInterval();을 삭제하면 1초마다 "안녕하세요"가 작성되는 것을 볼 수 있다.
See the Pen setInterval by coding-ji (@coding-ji) on CodePen.
'Frontend > JavaScript' 카테고리의 다른 글
JavaScript : Array관련 내장함수 (0) | 2024.08.04 |
---|---|
JavaScript 내장함수 : String관련 내장함수 (0) | 2024.08.04 |
JavaScript 내장함수 : 숫자 관련 내장함수 (0) | 2024.08.04 |
JavaScript 내장함수 : 인코딩 / 디코딩 함수 (0) | 2024.08.04 |
JavaScript : 예외처리에 대해서 알아보자 (0) | 2024.08.02 |
JavaScript : DOM 변화 감지하기 - MutationObserver (0) | 2024.08.02 |
JavaScript : 웹 컴포넌트(Web Component)란? (0) | 2024.07.31 |
JavaScript: Date 객체에 대해서 (0) | 2024.07.31 |