Javascript Float Becoming NaN After Use

Question

I have the following class

function Sprite( sprite, frameWidth, frameHeight )
{
    this.frameWidth = frameWidth;
    this.frameHeight = frameHeight;
    this.sprite = sprite;
    this.cycles = new Array( [ new AnimationPoint( 0, 0 ) ] );
    this.currentFrame = 0;
    this.currentCycle = this.cycles[ 0 ];
    this.scaleFactor = 1;
    this.pause = false;
    this.x = 0.0;
    this.y = 0.0;
    this.orientation = 0.0;
    this.transformQue = new Array();
    this.QueRotation = function( radians ) {
        this.transformQue.push( radians );
    }
    this.AddAnimationCycle = function( animationPoints ) {
        this.cycles.push( animationPoints );
    }
    this.Pause = function() {
        this.pause = true;
    }
    this.UnPause = function() {
        this.pause = false;
    }
    this.SelectAnimationCycle = function( cycle ) {
        this.currentFrame = 0;
        this.currentCycle = this.cycles[ cycle ];
    }
    this.Forward = function() {
        this.x += Math.cos( this.orientation ) * grid.UnitToPixelX( canvas );
        this.y += Math.sin( this.orientation ) * grid.UnitToPixelY( canvas );
    }
    this.Animate = function ()
    {
        renderContext.save();
        var rotation = this.transformQue.pop();
        var x = ( ( this.frameWidth * this.scaleFactor ) / 2 );
        var y = ( ( this.frameHeight * this.scaleFactor ) / 2 );
        renderContext.translate( this.x + x,
                this.y + y );
        renderContext.rotate( this.orientation += rotation );
        renderContext.translate( -( this.x + x ),
            -( this.y + y ) );
        renderContext.drawImage( this.sprite, 
                this.currentCycle[ this.currentFrame ].x * this.frameWidth, 
                this.currentCycle[ this.currentFrame ].y * this.frameHeight, 
                this.frameWidth, this.frameHeight, this.x, this.y, 
                this.frameWidth * this.scaleFactor, this.frameHeight * this.scaleFactor );
        renderContext.restore();
        if( this.pause == false )
        {
            ++this.currentFrame;
            if( this.currentFrame >= this.currentCycle.length )
                this.currentFrame = 0;
        }
    }
}

If I in my render function, do something like

mySprite.QueRotation( .1 )

It works forever.

However, if I have a function that calls QueRotation such as

function MySpriteClockWise() {
    mySprite.QueRotation( Math.PI / 2 );
}

It goes to NaN.

Stranger still, this.orientation = 0.0; however if I don't touch the QueRotation function inside my render function, it goes to NaN! Even after being assigned simply to zero and having not touched it! If I do a function such as:

starting = 0;

function MySpriteStart() {
    if( starting++ < 4 )
        MySpriteClockWise();
}

and watch the value in the console, it calculates just fine for as many times as I want to run the function, but as soon as it is done in the render function, it becomes NaN!

Its as if JS doesent think I need the value anymore, even if I make a function like:

this.Forward = function() {
    this.x += Math.cos( this.orientation ) * grid.UnitToPixelX( canvas );
    this.y += Math.sin( this.orientation ) * grid.UnitToPixelY( canvas );
}

to try to coax it into not throwing the value away, it still does! This is a big problem, because I am scripting through lua the whole point of the project is for (a coding tutorial) users to be able to script to control "mySprite" (a charachter) through lua to learn! This behavior is in both firefox and chromium. Please help!

Answer 1

Found a bug that explained the issue, I was hasty, it seemed like something to conserve on resources too me, I am sorry.