문제

얼마 전에 나는 질문을 게시했습니다 좋은 JavaScript 코더가 대답 할 수 있어야하는 질문. Meder는 다음과 같은 질문을 지적했습니다.

다음 코드는 "i"가 onclick 함수에서 값이 아닌 참조로 유지되기 때문에 "A"요소 (-1)를 클릭합니다.

<a href="#">text</a><br><a href="#">link</a>
<script>
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = function() {
        alert(i);
        return false;
    }
}
</script>

문제는 다음과 같습니다. onclick 함수가 i의 값을 유지하고 참조가 아닌이 구현을 수정하는 방법은 무엇입니까?

나는 대답을 모른다. 그것을 고치는 방법? 실제 참조가 아닌 참조 값의 사본이되도록하는 방법은 무엇입니까?

부수적 질문 : 모든 가변 유형이 참조로 전달됩니까? 아니면 원시 유형인지 객체인지 여부에 따라 다릅니 까?

모든 생각은 감사 할 것입니다.

도움이 되었습니까?

해결책

이 문제를 이해하려면 폐쇄 이다. 그런 다음 JavaScript가 범위를 어떻게 처리하는지 알아야합니다 (예를 들어 블록 기반이 아닌 기능-기반에 있습니다).

"Stantard"솔루션은 다음과 같습니다.

<a href="#">text</a><br><a href="#">link</a>
<script type="text/javascript">
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = (function(i) {
        return function() {
            alert(i);
            return false;
        }
    })(i);
}
</script>

다른 버전 바로 그거죠 똑같은 일이지만 JS의 폐쇄 및 범위에 익숙하지 않으면 이해하기가 더 쉽습니다.

for ( var i = as.length; i--; ) {
    as[i].onclick = (function(number) {
        return function() {
            alert(number);
            return false;
        }
    })(i);

아이디어가 있습니까?

다른 팁

<a href="#">text</a><br><a href="#">link</a>
<script>
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
    as[i].onclick = function() {
        return function() {
           alert(i);
           return false;
        }
    }();
}
</script>

아마도?

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top