1. 일정 간격으로 함수를 실행하는 함수는 setInterval입니다.

1. setTimeout 에 1000을 줬으니 그 안에 있는 console.log(i)는 1초뒤에 실행됩니다.

그런데 for문은 1초를 기다리지 않고 그냥 쭉 돕니다.

그러니까 1초뒤에 연달아 다찍히는겁니다. 1초간격으로 찍히는게 아니고.

2.setTimeout()을 제거 하면 for문이 돌면서 바로바로 값을 찍습니다. 그러니까 당연히 그때그때 값으로 찍히겠죠. setTimeout이 있으면 1초뒤에 실행하기 때문에 1초동안 for문은 다 돌게 되고 setTimeout 이 실행되는 순간 var값이 5가 되어 있기 때문에 5가 다찍히는겁니다. 

scope에 대한 개념보단 setTimeout의 동작방식을 잘 이해 못하신게 아닌가싶습니다.

2. var는 setTimeout이 있으면 전역 변수로 인식해서 이미 1000ms 뒤 i가 증가된 채로 console.log가 될 텐데 타이머 함수가 없다면, 반복문 호출에 의해 정상적으로 출력되는 것입니다.

gredo 님,

setInterval란 함수도 있었군요, 참고하겠습니다!

퀘이사123 님

질문 1번을 이해하니 2번도 의문이 풀리는 것 같습니다. setTimeout 함수 동작은 for문 동작과 별개로 동작하는 거였군요..

두 분의 친절한 답변 감사합니다!

질문1에 대해 쉽게 답변 드리자면

for문{

  //setTimeout으로 1초뒤에 콘솔출력하도록 합니다

  setTimeout(()=>console.log('text'),1000)

  //이때 자바스크립트는 setTimeout은 1초뒤에 console.log를 실행할때까지 기다려주지 않습니다

  //단지 1초뒤에 저 text를 출력하라고 예약을 시키고 다음구문으로 넘어갑니다

  console.log('done')

  //위 구문으로 'done' 이라는 글자가 출력됩니다

}

위 코드를 실행시키면

5번 반복 for문이라면 done 이라는 글자가 5번 먼저 출력되고

실제 for문은 끝난 상태에서 setTimeout으로 예약되었던 함수가 호출되면서 text 라는 글자가 약 1초뒤에

한꺼번에 출력될겁니다

피자7

오 자세한 설명 감사합니다^^

자바스크립트 이벤트 루프에 대해서 공부해보세요.

위 코드 동작 순서가 어떻게 되는지 알게 되실거에요.