Performance issues with saving object reference to array

Question

Why is v1 so much slower than v2?

v1 --

var foo = function (a,b,c) { 
   this.a=a; this.b=b; this.c=c; 
}
var pcs = new Array(32);
for (var n=32; n--;) {
    ref = new foo(1,2,3)
    pcs[n] = ref;    //*****
}

v2 --

var foo = function (a,b,c) { 
   this.a=a; this.b=b; this.c=c; 
}
var pcs = new Array(32);
for (var n=32; n--;) {
    ref = new foo(1,2,3)
    pcs[n] = 1;    //*****
}

I figured that since I'm holding a reference to the new object in 'ref', that simply assigning that reference to an element in the array would be about as fast as assigning a literal value, but it turns out that assigning the reference is considerably slower. Can anyone shed some light on this? Anything I can do to improve the performance here on V1?

Fiddle:

http://jsfiddle.net/a0kw9rL1/1/

Answer 1

simply assigning that reference to an element in the array would be about as fast as assigning a literal value

Yes, it basically is¹. However, allocating an object probably makes the difference here.
In V2, ref is only allocated once and repeatedly overwritten, it might be allocated on the stack not on the heap, and dead code elimination might even completely optimise it away.
In V1, ref needs to be allocated on the heap, and repeatedly in a new location, as all the different instances are accessible from pcs.

V1 is just eating more memory than V21. However, due to your very small array, the difference is neglible. If you use really large one, you can spot the difference: http://jsperf.com/array-reference-assignment/3

_{[1]: Well, for some reason not really. But I can't explain that, except garbage collection is different when you profile memory usage}