为什么最新的值覆盖到JavaScript对象数组？ [英] why the latest values are overriding into array of object in javascript?
问题描述
<html>
<head>
<style type="text/css">
#mycanvas{
width:500px;
height:450px;
border:2px solid green;
font-size:30px;
}
</style>
<script>
window.onload = function (){
vcan = {};
vcan.main = {}
vcan.main.repNode = [];
vcan.main.currentTransform = {'id':0, 'name':'myobj'}
document.getElementById("mycanvas").addEventListener('mousemove', mymousemove);
function mymousemove(){
var currAdTime = new Date().getTime();
console.log(currAdTime);
var myObj = extend(vcan.main.currentTransform , {mdTime:currAdTime, func:'add'})
vcan.main.repNode.push(myObj);
}
function extend (fobj, sobj){
if((typeof fobj == 'object') && (typeof sobj == 'object')){
for(var prop in sobj){
fobj[prop] = sobj[prop];
}
return fobj;
}else{
alert("it seems that the arguments you passed are not object");
}
}
document.getElementById("test").onclick = function (){
var output = "";
for(var i=0; i< vcan.main.repNode.length; i++){
output += vcan.main.repNode[i].mdTime;
output += "<br />";
}
document.getElementById("result").innerHTML = output;
}
}
</script>
</head>
<body>
<div id="mycanvas">
Please move the mouse inside this box
And click on Show Result
</div>
<button id="test">
Show Result
</button>
<div id="result">
</div>
</body>
</html>
有关解决问题，请使这些上面code到浏览器中。点击显示结果按钮后会有显示的时间。我的问题是，为什么所有被同时显示。
For solve problem please render these above code into browser. After click on Show Result button there would be shown time. My question is that why all the same time are displaying.
时间的最新值覆盖到物体的阵列的不同元素。
The latest value of time is overriding into different element of array of object.
同时，如果我们看到控制台那么时间会有所不同。
At the same time if we see the console then time would be different.
长的搜索后，我无法解决这个问题。请你们帮我解决这个问题。
After long search, I could not solve this problem. Please guys help me to solve this problem.
推荐答案
下面是一个固定的解决方案的http：// jsfiddle.net/WacV4/1/ 。在JS对象通过引用在 mymousemove 分配不是通过复制它的价值，所以 MyObj中总是修改相同的值。你只需要扩展之前复制 vcan.main.currentTransform 。
Here is a fixed solution http://jsfiddle.net/WacV4/1/. Object in JS are assigned by reference not by copying its values, so myObj in mymousemove always modifies the same value. You just need to copy vcan.main.currentTransform before extending.
这篇关于为什么最新的值覆盖到JavaScript对象数组？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
