루프에서 var 정의 함수 문제 해결

9ccad8ada0cb44a7b67f7e2254ae3058.png

  위의 코드에서 setTimeout은 비동기 함수이므로 루프가 먼저 실행되며 이때 i는 6이므로 6개가 한 묶음으로 출력됩니다.

세 가지 솔루션이 있습니다.

1. 클로저 방식 사용 + 함수 즉시 실행

68678f3f550944f79b8ce50834c7be3e.png

 먼저 즉시 실행 함수를 사용하여 함수에 i를 전달합니다. 이때 값은 매개 변수 j에 고정되어 변경되지 않습니다. 다음에 타이머 클로저가 실행될 때 외부 함수의 변수 j를 사용할 수 있습니다. 목표를 달성하기 위해.

2. setTimeout의 세 번째 매개변수 사용

f6c0f38c7b644e5aa661e69689469827.png

이 매개변수는 타이머 함수의 매개변수로 전달되어 먼저 실행됩니다.

3. let을 사용하여 i를 정의합니다.

74ba47c00cc844949830937b0f034b54.png

원칙은 다음과 같습니다.

var 에서 setTimeout 은 비동기적으로 실행됩니다. i * 1000ms 후에 태스크가 태스크 큐에 추가됩니다. 메인 라인의 모든 태스크가 실행될 때만 태스크 큐의 태스크가 실행됩니다. 메인 라인이 실행된 후 , i는 6이므로 이때 태스크 큐에 있는 태스크가 실행되면 i는 모두 6이다.

 for 루프가 실행될 때마다 settimeout이 한 번 실행되지만 내부 함수는 실행되지 않고 작업 대기열에 배치되어 실행 대기 상태가 됩니다. 실행되면 실행을 위해 작업 대기열에 들어갑니다.

let 에서 for 루프의 헤드에 있는 let 은 i 를 for 루프에 바인딩할 뿐만 아니라 루프 본문의 각 반복에 다시 바인딩하여 이전 반복의 끝에 있는 값이 다시 할당되도록 합니다. setTimeout의 function()은 새로운 도메인에 속합니다. var에 의해 정의된 변수는 함수 실행 도메인으로 전달될 수 없습니다. let을 사용하여 블록 변수를 선언하면 이 블록에서 작동할 수 있으므로 함수는 변수 i up을 사용할 수 있습니다.

알아채다:

  var 명령의 변수 승격 메커니즘으로 인해 var 명령은 실제로 한 번만 실행되는 반면 let 명령에는 변수 승격이 없으므로 각 주기가 한 번 실행되어 새 변수를 선언합니다(그러나 초기화된 값은 서로 다른), for It 의 각 주기는 서로 다른 블록 수준 범위입니다. let 으로 선언된 변수도 블록 수준 범위이므로 반복 선언 문제가 없습니다. 새로운 변수를 의미합니다.

 

Supongo que te gusta

Origin blog.csdn.net/m0_65835778/article/details/125676595
Recomendado
Clasificación