JavaScript变量声明问题

Question

var Stars = new Array(1,2,3,4,5,6,7,8,9,10);
var StarsX = new Array(451,455,460,470,490,100,160,220,280,300);
var StarsY = new Array(451,455,460,470,490,480,390,330,200,120);
var Starsm = Stars
var StarsmX = StarsX
var StarsmY = StarsY

//just shows the output of the variables in a text field
function contpost(){Tfield.innerHTML=Stars + "<br/>" + StarsX + "<br/>" + StarsY + "<br/>" + Starsm + "<br/>" + StarsmX + "<br/>" + StarsmY;}

//cycles through the "for" loop and posts the variables
function newpost(){
for (var i=0;i<Stars.length;i++){
    StarsmX[i] = StarsX[i] + 10;
    StarsmY[i] = StarsY[i] + 10;
    }
contpost()
}


var Tfield= (This is the text field)
var canv_one= (This is a canvas in my document)
canv_one.addEventListener('click', newpost);

If I run this code (Firefox 9), the if/then loop adds 10 to both the "mX" variable and the "X" variable.

I now know approximately how it does it. It's simply because I set them equal early on. When I substitute this in the declarations, it works properly:

var Starsm = new Array()
var StarsmX = new Array()
var StarsmY = new Array()

What I don't understand is why javascript is doing this. It seems logical to me that if you set them equal once, during the global declaration, they will not re-equate later on (and do it backward, at that. I never set StarsX equal to StarsmX.)

I'm pretty sure this means I'm not understanding some kind of basic functionality of Javascript, and that worries me.

Can anybody help?

Answer 1

It isn't adding anything to the variable. It's adding to the Array, and both variables reference the same Array object.

This is because in JavaScript you only get to hold a reference to an object, not the object itself. So the reference to the Array is the value being copied, not the Array.

If you wanted a shallow clone of the Array, use slice() .

var Starsm = Stars.slice()
var StarsmX = StarsX.slice()
var StarsmY = StarsY.slice()

Or just do as you said, and create empty Arrays.