> 웹 프론트엔드 > JS 튜토리얼 > JavaScript closures_javascript 기술을 설명하는 몇 가지 간단한 문장

JavaScript closures_javascript 기술을 설명하는 몇 가지 간단한 문장

WBOY
풀어 주다: 2016-05-16 18:11:46
원래의
991명이 탐색했습니다.

리소스를 해제하지 않은 스택 영역과 사전 실행 프로세스는 무엇입니까? 가장 일반적인 예를 사용하여 설명하겠습니다.
예를 들어 이제 아래에 많은 li가 있는 ul이 있으며 이를 탐색하고 바인딩해야 합니다. 클릭 이벤트를 클릭한 후 추가 처리를 위해 현재 아래 첨자를 다른 함수에 전달합니다.

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

for(var i=0; i agroup[i].onclick = function() {
 handler(i)
 }
}

실행 결과는 뻔하죠? 핸들러에서 전달된 매개변수 i를 가져오면 이때 일반적으로 가장 큰 첨자만 표시됩니다. 다음 방법을 사용하십시오. 해결 방법:
코드 복사 코드는 다음과 같습니다.

for(var i=0; i agroup[i].i = i
agroup[i].onclick = function() {
handler(this.i); >}
}

여기서는 this의 포인팅 문제에 대해 이야기해 보겠습니다. 일반적으로 JavaScript에서 this는 현재 참조하는 개체를 가리킵니다. 위에서 i라는 새 속성을 추가했으며 그 값은 현재 첨자 값입니다.
그렇다면 클로저를 사용하여 이 문제를 어떻게 해결할 수 있을까요? 사실 원리는 동일합니다. i 값을 미리 저장하거나 전송이라고 불러야 합니다.

코드 복사 코드는 다음과 같습니다.
for(var i=0; i agroup[i].onclick = function(index) {
return function() {
handler (index);
 }
 }(i);
}

이때 올바른 첨자를 얻게 됩니다. i 속성을 추가하는 것과 유사합니까? 즉, 모두 미리 첨자 i 값을 전달하거나 저장합니다. 위 데모에서는 onclick이 참조하는 함수가 사전 실행되었으며 이
함수는 인라인 함수를 반환하여 리소스가 해제되지 않은 스택 영역을 형성하고 사전 실행 중에 i 값이 매개 변수로 변경됩니다. 양식이 이 범위에 전달됩니다(설명 능력에 문제가 있습니다. 이 설명이 정확한지 모르겠습니다. 시도해 보십시오).
요약하자면 클로저의 역할은 일반적으로 범위나 사전 실행을 변경하는 것입니다. 위에 제시된 예제는 클로저의 적용 범위가 매우 넓다는 점을 독자가 분명히 알 수 있습니다. 원인과 결과를 이해해야만 클로저를 유연하게 사용할 수 있습니다.
이모 2011-11-15
mail Auntion@gmail.com
QQ 82874972
원작, 글의 노고와 저자의 권리를 존중해 주시길 바랍니다. 재인쇄할 때 여기로 가세요.
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿