JavaScript variables giving the correct value when stepped through using the console, but not otherwise

Question

I have a variable in a JavaScript constructor that appears to be set to the correct value when stepped through using breakpoints. However, when run without breakpoints, the variable (supposed to be an array that I give it), comes up as an empty array in the console. I don't know whether or not using the get/set property of prototype, as described here. Also-- I'm working in webkit, so if someone could help explain to me why it isn't working there, I'd appreciate it. Thanks!

function Box(inElement){
    var self = this;
    this.element = inElement;
    this.boxes = (function () {
        var boxes = [];
        for (var i = 0; i < inElement.childNodes.length; ++i) {
            if (3 !== inElement.childNodes[i].nodeType) {
                boxes.push(inElement.childNodes[i]);
            }
        }
        return boxes;
    })();
    this.rotation = [-40,-20,0,20,40];
}

Box.prototype = 
{   
    get rotation(){
    return this._rotation;
    },

    set rotation(rotArray){

        console.log('rotArray');
        console.log(rotArray);

        var thisrot;
        this._rotation = rotArray;
        for(var i=0; i<this.boxes.length; i++){
            thisrot = rotArray.shift();
            this.boxes[i].style.webkitTransform = 'rotateY(' + thisrot + 'deg) translateZ(170px)';
        } 
    }
}

function loaded()
{
    new Box(document.getElementById('area'));
}

window.addEventListener('load',loaded, true);

So, after some fiddling, I discovered that boxes.push(inElement.childnodes[i] is the problematic line. When commented out, the value comes out as expected.

This might be a scope issue - could you post your code please? — yoozer8, Aug 09 '11 at 17:58
which variable is the problematic one? rotation, when set through setter? — Daniel Baulig, Aug 09 '11 at 18:32
Well, rotArray is returning [], which I expect to be [-40,-20,0,20,40] . — Temperate, Aug 09 '11 at 18:38

score 1 · Accepted Answer · answered Aug 09 '11 at 18:49

You are removing all elements from your array in the loop inside of set rotation using shift. Arrays are passed by reference in JavaScript, not by value. If you want to create a copy of your array, you will have to use Array.slice:

this._rotation = rotArray.slice();

JavaScript variables giving the correct value when stepped through using the console, but not otherwise

1 Answers1