JavaScript에서 참조 값을 복사하는 방법은 무엇입니까?
-
12-09-2019 - |
문제
얼마 전에 나는 질문을 게시했습니다 좋은 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>
아마도?
제휴하지 않습니다 StackOverflow