Javascript Array Scope Issue

SOLVED - This example code worked, so I compared it to the non-working I had and found a discrepancy. In my code, the one that did not work, when declaring the color array I forgo

Solution 1:

The variable's scope is within function ParticleClass(). So variables in functions defined in this space will share the scope with its parent..

This is why sometimes you see this pattern in Javascript -

var self = this;
$('.someClass').each(function(i) {
   // function is defined as a closure// but it shares its scope with its parent so it can see self and access the parent's  // pointer to this.
});

Why don't you use prototype to define to the functions...

E.g..

var myClass = function() {
  this.stuff = 1;
}
myClass.prototype.myFunc = function() {
  // Do Something..this.stuff += 5;
}

// Then create instances of your class withvar i = newMyClass();

This will get you the namespace you want...

Here's an example: http://jsfiddle.net/RvCgJ/

Solution 2:

There's no problem with the code you posted, but having said that, you're making life more difficult by doing it this way; it's better to make proper use of prototypes:

functionParticleClass()
{
    this.m_color = [255, 255, 255, 255];

    this.m_red = 255;
    this.m_green = 255;
    this.m_blue = 255;
}

(function(p) {

p.SetRandomColorRGB = function () {
        this.m_red = Math.floor( Math.random() * 255 );
        this.m_green = Math.floor( Math.random() * 255 );
        this.m_blue = Math.floor( Math.random() * 255 );
}

p.SetRandomColorArray = function () {
        this.m_color[0] = Math.floor( Math.random() * 255 );
        this.m_color[1] = Math.floor( Math.random() * 255 );
        this.m_color[2] = Math.floor( Math.random() * 255 );
}

p.DrawParticleRGB = function( ctx ) {
        // I draw the particle using m_red, m_green and m_blue.
}

p.DrawParticleArray = function( ctx )
{
        // I draw the particle using m_color[0], m_color[1], m_color[2]
}

}(ParticleClass.prototype);

Solution 3:

here... this may help explain why it is happening :

vardata             = {};               // create a  data object data.string          = "hey society";    // Add a string value propertydata.num             = 0;                // Add a integer value propertydata.arr             = [0,1,2];          // Add an array propertydata.date            = new Date();       // Add an object property// here is where the fun starts! // Create a var for string propertyvar sString          = data.string;      // sets to "hey society", as expected.. cooldata.string          = "changed"// change the value and the compare :data.string         == sString           // returns false, the values are different// same happens for a number.// Now lets copy this arrayvar oArr             = data.arr;         // (seeing the comment pattern? XD)data.arr             .push(3);           // and modify it.data.arr            == oArr              // should be false? Nope. returns true.// arrays are passed by reference.var oDate            = data.date           // what about objects?       data.date            .setHours(0);         // modify the variable and
oDate.getTime()     == data.date.getTime() // it returns true, too!// so, how do we fix the array problem?// right in front of yer nosevar oArrFix          = data.arr.splice(0) // get a new array based on data.arr             .push(4)             // an unmodified version of the originaldata.arr            == oArrFix            // false.. huh..// How do we use this as a fixdata.arr["changed"] == false;

oArrFix              = ChangeOriginalArray( data.arr );

// When you are expecting an array..
function ChangeOriginalArray( arr )       // pass as a parameter
{
    var aArr = arr.splice(0);             // make a copy!if (aArr["changed"] == false)         // check has same value!
    {
        aArr["newKey"]   = "newVal";      // add a value

        arr["changed"]   = true;          // change original value
    }

    return aArr;
}

oArrFix["newKey"]       == data.arr["newKey"] // false
oArrFix["changed"]      == true// no, createddata.arr["changed"]     == oArrFix["changed"] // nah, passed by value, not reference