setTimeout, clearTimeout, setInterval, clearInterval

setTimeout : 일정 시간이 지난 후 함수를 실행

clearTimeout : 예정된 작업을 없앤다.

setInterval : 일정 시간 간격으로 함수를 반복

clearInterval : 예정된 작업을 없앤다.

-----------------------------------------------------------------------------------

function fn() {
  console.log(3)
}

setTimeout(fn, 3000); // 3초 후에 log 찍어주기

-----------------------------------------------------------------------------------

setTimeout(function() {
  console.log(3)
}, 3000);

-----------------------------------------------------------------------------------

function showName(name) {
  console.log(name);
}

setTimeout(showName, 3000, 'Mike'); // 함수, 시간, 인수

-----------------------------------------------------------------------------------

clearTimeout : 예정된 작업을 없앤다.
// clearTimeout(tId);

const tId = function showName(name) {
  console.log(name);
}

setTimeout(showName, 3000, 'Mike'); // 함수, 시간, 인수

clearTimeout(tId); // 3초가 되기 전에 스케줄링 취소되어, 아무일도 일어나지 않는다.

-----------------------------------------------------------------------------------

function showName(name) {
  console.log(name);
}

const tId = setInterval(showName, 3000, 'Mike'); // setInterval : 계속 반복 수행, 3초 마다 Mike 찍힘

// 중간에 중단하려면, clearInterval(tId); 수행

-----------------------------------------------------------------------------------

setTimeout(function() {
  console.log(2) // 2번째 실행
}, 0); 
// 0초로 설정해도 바로 실행되지 않는다, 현재 실행중인 script가 종료된 이후에 실행
// 브라우저는 기본적으로 4ms 내외의 대기시간 존재

console.log(1);  // 1번째 실행

-----------------------------------------------------------------------------------

// setInterval, clearInterval

let num = 0;

function showTime() {
  console.log(`안녕하세요. 접속하신지 ${num++}초가 지났습니다.`);
}

setInterval(showTime, 1000);

-----------------------------------------------------------------------------------

// setInterval, clearInterval

let num = 0;

function showTime() {
  console.log(`안녕하세요. 접속하신지 ${num++}초가 지났습니다.`);
  if ( num> 5) {
    clearInterval(tId);
  }
}

const tId = setInterval(showTime, 1000);