JavaScript 루프의 폐쇄 문제를 방지하는 방법은 무엇입니까?

루프 내부의 JavaScript 클로저: 실제 예

루프를 반복하고 익명 함수를 저장할 때 발생하는 문제는 이러한 함수 내의 변수가 루프 외부에서 동일한 변수를 참조합니다. 이로 인해 이러한 변수의 값을 기록하려고 할 때 예상치 못한 동작이 발생할 수 있습니다.

해결책 1: ES6 Let 문

ES6에는 새로운 let 키워드를 생성하는 let 키워드가 도입되었습니다. 루프의 각 반복에 대한 가변 범위. 이렇게 하면 각 익명 함수에 고유한 변수가 있어 클로저 문제가 해결됩니다.

<code class="js">for (let i = 0; i < 3; i++) {
  funcs[i] = function() {
    console.log("My value:", i);
  };
}</code>

해결책 2: ES5.1 ForEach 메서드

주로 관련이 있는 상황의 경우 배열 반복을 수행하는 경우 forEach 메서드는 간단한 솔루션을 제공합니다. 콜백 함수의 각 반복에는 자체 클로저가 있으며 배열의 현재 요소를 받습니다.

<code class="js">var someArray = [...];
someArray.forEach(function(arrayElement) {
  // Code for the specific array element
  // ...
});</code>

해결책 3: 클래식 클로저

또 다른 해결책은 다음과 같습니다. 각 함수 내의 변수를 함수 외부의 변경되지 않는 별도의 값에 바인딩합니다. 이는 도우미 기능을 사용하여 달성할 수 있습니다:

<code class="js">function createFunc(i) {
  return function() {
    console.log("My value:", i);
  };
}

for (var i = 0; i < 3; i++) {
  funcs[i] = createFunc(i);
}</code>

위 내용은 JavaScript 루프의 폐쇄 문제를 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!