[JS] Timeout

window.setTimeout(callback, millisec)

- 설정한 시간만큼 기다린 후에 콜백 메서드를 한 번 실행한다.

 

window.setInterval(callback, millisec)

- 설정한 시간마다 콜백 메서드를 실행한다.

 

window.clearTimeout(initDiv)

- 타임아웃 삭제

 

window.clearInterval(moveDiv)

- 인터벌 삭제

const out = document.getElementById('out');
// 인터벌 또는 타임아웃을 삭제하고 싶으면 생성 시에 인스턴스를 받아놓아야 한다.
const initDiv = window.setTimeout(() => {
    out.appendChild(document.createElement('div'));
}, 500);
// 타임아웃 삭제
// window.clearTimeout(initDiv);
const moveDiv = window.setInterval(() => {
    const box = document.querySelector('#out > :first-child');
    if (box == null) {
        return;
    }
    box.style.left = parseInt(Math.random() * (out.clientWidth - 99)) + 'px';
    box.style.top = parseInt(Math.random() * 401) + 'px';
}, 500);
// window.setTimeout(() => {
//     // 인터벌 삭제
//     window.clearInterval(moveDiv);
// }, 2000);