setTimeout
일정시간 뒤에 함수를 실행한다setInterval
일정시간 간격으로 함수를 반복한다.function fn() {
console.log(3);
}
setTimeout(fn, 3000);
// 위 아래 코드 모두 같은 의미이다.
setTimeout(() => {
console.log(3);
}, 3000);
-------------------------------------------------------------------------------
function showName(name) {
console.log(name);
}
setTimeout( showName, 3000, 'Mike');
// 함수 시간 인수(showName함수의 인수로 전달된다)
clearTimeout() 예정된 작업을 없앤다.
function showName(name) {
console.log(name);
}
const a = setInterval( showName, 3000, 'Mike');
// 3초마다 Mike가 생성된다
// 중간에 멈추려면 clearTimeout(a)를 사용하면 된다.
setTimeout(() => {
console.log(2);
}, 0);
console.log(1);
// 0초가 되도 바로 2가 실행되는 것이 아니라 1이 실행되고 2가 실행된다.
// 브라우저는 기본적으로 4ms~ 이상의 대기시간이 있다
let num = 0;
function showTime() {
console.log(`대기시간 ${num++}초가 지났습니다`);
}
setInterval(showTime,1000);
=>대기사간 0초가 지났습니다
대기사간 1초가 지났습니다
대기사간 2초가 지났습니다
.
.
무한 반복된다
중간에 정지하고 싶다면 clearTimeout을 사용하면 된다.
let num = 0;
function showTime() {
console.log(`대기시간 ${num++}초가 지났습니다`);
if(num > 5){
clearTimeout(iTd);
}
const tId = setInterval(showTime,1000);
=>대기사간 0초가 지났습니다
대기사간 1초가 지났습니다
대기사간 2초가 지났습니다
.
.
대기사간 5초가 지났습니다
5초에서 멈춘다