클로저는 다른 함수 범위에서 변수에 액세스 할 수있는 권한이있는 함수를 말하지만 범위 구성 메커니즘은주의를 기울여야합니다. 즉, 클로저는 함수의 변수를 포함하는 마지막 값 만 얻을 수 있습니다.
다음과 같이 :
함수 create () {var arr = new array (); for (var i = 0; i <10; i ++) {arr [i] = function () {return i;}; } return arr;} var c_arr = create (); for (var i = 0; i <c_arr.length; i ++) {docum }실행 결과 :
표면적으로, 각 함수에 의해 반환 된 i 값은 다르고, 예를 들어, c_arr [0]의 값은 0이어야하고 c_arr [1]의 값은 1이어야합니다. 각 함수는 10을 반환하여 얻을 수 있습니다. 왜?
각 함수의 스코프 체인은 create () 함수의 활성 객체를 저장하기 때문에 모두 동일한 변수 i를 나타냅니다. for 루프 종료 후, i의 값은 10이된다.이 시점에서, 각 함수는 변수 i를 보유하는 동일한 변수 객체를 나타냅니다.
우리는 다른 도메인 함수를 만들어 예상대로 폐쇄를 강제로 강제하여 각 위치가 해당 값에 해당합니다.
함수 create () {var arr = new array (); for (var i = 0; i <10; i ++) {arr [i] = function (num) {return function () {return num; };}(나); } return arr;} var c_arr = create (); for (var i = 0; i <c_arr.length; i ++) {docum }실행 결과 :
익명 함수를 정의하고 익명 함수를 즉시 실행하여 배열에 할당하십시오. 여기서 익명 함수에는 매개 변수 Num이 있으며, 이는 최종 함수에 의해 리턴 할 값입니다. 각 함수를 호출 할 때 변수를 전달합니다. i. 함수 매개 변수는 값으로 전달되므로 변수 i의 현재 값은 매개 변수 Num에 할당됩니다. 이 익명 함수 내부에서 Closure 액세스 NUM이 생성되고 반환되므로 ARR 어레이의 각 함수에 자체 NUM 변수의 사본이 있으므로 자체 숫자 값을 반환 할 수 있습니다.
고전적인 예
전형적인 예를 살펴 보겠습니다. 페이지에 버튼 태그 세트가 있다고 가정합니다. 우리는 스크립트를 사용하여 클릭 이벤트를이 버튼 태그 세트에 바인딩하며 클릭 할 때 어떤 태그가 나타납니다.
<meta charset = "utf-8"/> <button> 첫 번째 </button> </button> 두 번째 </button> <버튼> 세 번째 </button> <button> 네 번째 </button> <script type = "text/javaScript"> var obj = document.getElementsByTagName ( 'button'); for (var i = 0; i <obj.length; i ++) function () {alert (i);}; } </스크립트>결과를 얻으려면 각 버튼을 클릭하십시오
표면적으로 각 레이블을 클릭하면 다른 숫자가 나타나야합니다.
첫 번째는 0을 나타 내야합니다.
두 번째는 팝업 1;
등.
그러나 결과는 모든 버튼이 팝업 된 것입니다. 이는 분명히 우리가 원하는 결과가 아닙니다.
프로그램을 변경합시다
<meta charset = "utf-8"/> <button> First </button> </button> </button> <button> 세 번째 </button> <button> 네 번째 </button> <script type = "text/javaScript"> var obj = document.getElementsByTagName ( 'button'); for (or (<obj.) function () {alert (num);}} (i); } </스크립트>두 번째를 클릭하십시오
네 번째를 클릭하십시오
기능에서 익명의 함수 만 만들면 위의 경우와 동일합니다. 외부 변수 i를 캡처하기 위해 익명 함수를 구현할 수 있으며 각 버튼 팝의 I 값은 다릅니다.