CODEWITHSUNDEEP
javascriptmodule-pattern
Queequeg
Queequeg

Reputation: 2894

What's wrong in this Module snippet?

I want to have private properties in an object. The following code doens't work:

var GameModule = (function(ns){

    function Game(ctx) {
        var self   = this, //use self in callback methods (requestAnimationFrame etc)
            ctx    = ctx,

        var dx = 1,
            dy = 1;

        console.log(dx, dy); //writes 1,1,

        console.log(self.dx, self.dy); //writes undefined, undefined
    }

    ns.Game = Game;
    return ns;

})(GameModule || {});

//somewhere later in a different file
$(document).ready(function(){
   var game = new GameModule.Game(some_ctx);
});

It seems like the vars are analogous to static members, not private.

Do I have to write this.dx = 1 to make the variable accessible (in member functions for instance)? Doesn't it make the variable public?

Upvotes: 1

Views: 54

Answers (3)

gmiills
gmiills

Reputation: 1

I'm not sure what the actual problem is, but one issue I see is that your not executing Game by: 

ns.Game = Game();

But to make a var accessible outside of the object, you have to either do this.dx or have a return statement like:

return {
  dx: dx,
  dy: dy
}

Is this what you are looking for?

Upvotes: 0

Travis J
Travis J

Reputation: 82337

There were several errors in the module you had created. Firstly, dx is a private variable when defined with var dx. It can be accessed inside of the function, but not outside unless exposed through a return statement which would make it psuedo public.

However, there is a key distinction that I believe you missed. There are two types of functions. A function which can be called such as function func(){} and a Function Object which is when the new keyword is issued to a function, making it into a Function Object, such as new func();, or in your example here new GameModule.Game(some_ctx);.

Once Game has been instanced with the new keyword, Game is a Function Object, and is an instanceof Game. At this point, variables or functions may be attached the the function object using the this keyword. Inside of a Function Object, this refers to the object, whereas outside of a Function Object this refers to the window. You cannot use var this.variableName because that is not valid syntax. You are not creating a variable, you are extending the object. Thus, var dx and this.dx are two different locations in memory and have different values.

I hope that clarifies some of this for you.

Here is a demo: http://jsfiddle.net/BCZKG/

js:

var GameModule = (function(ns){

    function Game(ctx) {
        var self = this,
        ctx = ctx,
        dx = 1,
        dy = 1;
        self.dx = 2,
        self.dy = 2;

        console.log(dx, dy);//1 1
        console.log(self.dx, self.dy);//2 2
    }

    ns.Game = Game;
    return ns;
})(GameModule || {});

var some_ctx = {};
var game = new GameModule.Game(some_ctx);

Upvotes: 1

Justin Lau
Justin Lau

Reputation: 360

To define class properties in Javascript, you do it like so (Fiddle):

var Class = function(){

    this.property = 'now this is a property';

    Class.staticProperty = 'and this is a static property';

    var property = 'this is NOT a property, but a local variable';
};

Class.prototype.propertyToo = 'this is also a property';

var object = new Class();

console.log(object.property);
console.log(object.propertyToo);
console.log(Class.staticProperty);

JavaScript by the language itself did not provide any access modifier, so private properties can not be done without tricky methods.

Upvotes: 1

Related Questions