setTimeout 인자있는 함수 지연 실행
setTimeout 은 원하는 function을 지연실행할 수 있도록 도와준다.
---------------------------------
function printWorld (){
alert("hell world...");
}
setTimeout( printWorld , 1000); //1초 뒤에 실행
----------------------------------
그러면 인자가 있는 function을 지연 실행하려면??
----------------------------------
/**
* @param{string} param
*/
function printWorld (param){
alert(param);
}
----------------------------------
이건 안된다.
함수야 실행되겠지만 바로 실행되고
지연 실행되야는건 printWorld의 리턴값인데
printWorld은 아무것도 리턴하지 않으니
----------------------------------
setTimeout( printWorld("hell world..."), 1000); //안되용
-----------------------------------
자바스크립트 클로저를 여기서 활용한다
내부 temp변수를 참조하는 익명 function을 반환하는
function을 선언한다.
----------------------------------------
function printWorld(param){
var temp = param;
return function(){
alert(temp);
};
}
setTimeout ( printWorld("hell world..."), 1000);
setTimeout ( printWorld("cool world..."), 2000);
setTimeout ( printWorld("water world..."), 3000);
----------------------------------------
결과적으로 아래 3개의 함수를 선언해서 호출하는 효과가 일어난다.
function() { alert("hell world...") };
function() { alert("cool world...") };
function() { alert("water world...") };
클로저를 활용하기 싫으면
이렇게 해도 되긴된다.
setTimeout 인자를 문자열로 넘겨버리는 것이다.
----------------------------------------
function printWorld (param){
alert(param);
}
setTimeout( 'printWorld ("hell world")' , 1000);
setTimeout( 'printWorld ("cool world")' , 2000);
setTimeout( 'printWorld ("water world")' , 3000);
----------------------------------------
끝~~
덤으로 setTimeout은 너무 남발하게되면
타이밍 이슈의 늪에 빠질 수 있으니 주의