Wie den Wert eines Bezugs in Javascript kopieren?
-
12-09-2019 - |
Frage
Vor einiger Zeit gab ich eine Frage zu was Fragen sollten beantwortet ein guter Javascript-Codierer der Lage sein. Meder wies auf die folgende Frage:
Der folgende Code macht Klicks auf jedem „ein“ Element (-1) aufgrund der Tatsache aufmerksam zu machen, dass „i“ in der Onclick Funktion als Referenz halten und nicht als Wert:
<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>
Die Frage ist: Wie dieses Problem zu beheben Implementierung, so dass der Onclick Funktion hält den Wert von i und nicht es ist Referenz?
Ich weiß nicht, die Antwort. Wie man es repariert? Wie mache mir eine Kopie des Referenzwertes zu sein, anstatt die tatsächliche Referenz?
Side Fragen: Sind alle Variablentypen als Referenz übergeben? Oder macht es ab, ob es ein primitity Typ oder ein Objekt?
würde Irgendwelche Gedanken geschätzt.
Lösung
Um dieses Problem zu verstehen, müssen Sie lernen, was eine Schließung ist. Dann müssen Sie auch wissen, wie Sie Javascript beschäftigt sich mit Rahmen (es ist auf einer Funktionsbasis anstatt auf einer Block-Basis als C zum Beispiel).
Hier ist die "stantard" Lösung:
<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>
Eine andere Version, die funktioniert genau die gleiche Sache, aber vielleicht leichter zu verstehen, wenn Sie nicht zu Schließungen und Umfang in JS verwendet werden, ist:
for ( var i = as.length; i--; ) {
as[i].onclick = (function(number) {
return function() {
alert(number);
return false;
}
})(i);
Haben Sie die Idee?
Andere Tipps
<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>
vielleicht?