Javascript의 setTimeout() 클로저 기능을 사용할 때 주의해야 할 사항

이 글에서는 Javascript의 setTimeout(0) 클로저 기능을 사용할 때 주의해야 할 사항을 주로 소개합니다. 필요한 친구들이 참고할 수 있습니다.

setTimeout은 실행을 지연시키기 위해 자주 사용됩니다. 특정 함수의 사용법은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

setTimeout(function(){
…
}, timeout);

때때로 setTimeout(function... ,0)은 비동기 처리에 사용됩니다. 예:

코드 복사 코드는 다음과 같습니다.

function f(){
… // get ready
setTimeout(function(){
…. // do something
}, 0);
  
return …;
}

함수 프로세서 설정 전 setTimeout에 의해 f 함수는

비동기 처리를 사용할 때, 특히 클로저 기능을 사용할 때 주의해야 합니다.

예:

복사 code 코드는 다음과 같습니다.

for(var i = 0 ; i < 10; i++){
setTimeout(function(){
console.log(i);
}, 0);
}

이 방법을 처음 사용하는 학생들의 경우 프로그램이 0...9를 인쇄할 것이라고 생각할 수 있지만 결과는 실제로 10 10s를 인쇄합니다.
문제는 루프가 완료되고 함수가 실행되고 i가 10이 되면 console.log(i)에 사용된 값이 10이라는 것입니다!

목적이 0...9를 인쇄하는 것이라면 방법을 변경하고 함수 매개변수를 사용하여 0...9를 저장할 수 있습니다(실제로 클로저도 사용됩니다):

코드 복사 코드는 다음과 같습니다.

for(var i = 0 ; i < 10; i++){
setTimeout((function(i){
return function(){
console.log(i);
}
})(i), 0);
}

자바스크립트의 setTimeout() 클로저 기능을 사용할 때 주의해야 할 또 다른 사항은 관련 기사를 보려면 PHP 중국어 웹사이트를 주목하세요!