What happens with “var” variables inside a JavaScript Constructor?

Question

example:

function Foo() {
    this.bla = 1;
    var blabla = 10;
    blablabla = 100;
    this.getBlabla = function () { 
        return blabla; // exposes b         


        

Answer 1

It will become a local (think of 'private') variable within Foo(). Meaning that you can't access it outside of Foo().

function Foo() {
  this.bla = 1; // this becomes an extension of Foo()
  var blabla = 10; // this becomes a "Local" (sort of like a 'private') variable
}

You could expose it (by returning it) with a Foo method.

function Foo() {
    var blabla = 10; // local

    this.getBlabla = function () { 
        return blabla; // exposes blabla outside
    }
}

Now outside of Foo():

var FooBar = new Foo();

var what_is_blabla = FooBar.getBlabla(); //what_is_blabla will be 10

jsFiddle demonstration

Answer 2

That variable is local to the constructor and won't be accessible outside of that scope (be it through this or otherwise), unless it is captured by a closure.

Answer 3

blabla can almost be considered a private member of Foo.

See this article from Douglas Crockford.

Answer 4

Any internal-methods you give to this -- ie: this.method = function () {}; while inside of your Foo constructor function, are all going to have a reference to the blahblah which is unique to each instance of a Foo object.

function Wallet () {
    var balance = 0;
    this.checkBalance = function () { return balance; };
    this.depositAmount = function (amount) { balance += amount; };
}


var wallet = new Wallet();
wallet.checkBalance();   // 0
wallet.depositAmount(3);
wallet.checkBalance();   // 3

But it's completely protected from access outside of wallet, unless you return it to somebody, from a privileged function.

wallet.balance; // undefined;

(added bit of interest -- if balance is a string, a number, or a boolean, even if you return it, that won't give people editing rights, or even permanent viewing access -- scalar variables are passed by value, so you're just passing the value of balance at the time -- if, however, balance was an object, a function or an array, they'd have permanent access to modify the crap out of your internal workings)

Note: methods HAVE to be assigned inside of the constructor for this to work. Prototypes can't access internal variables. Adding methods later won't give them access to internal variables.

This means that each instance will take up a little more memory, because each has its own copy of the methods, and has its own copy of the vars. But if what you're doing requires private data, this would be a good way to get it.

Answer 5

If you don't use the var keyword, "blabla" becomes a global variable. At other points in the code if you also use blabla without var, it will also be global, and you can accidentally change other instances of blabla and introduce unintended bugs in your code. "var" puts the variable in the current scope, so in the case above, it's only accessible to Foo.

Answer 6

In your example blabla is a local variable, so it will go away when the constructor function ends.

If you declare a function inside the constructor, which uses the variable, then the variable will be part of the closure for that function, and survives as long as the function (i.e. normally as long as the object):

function Foo() {
  this.bla = 1;
  var blabla = 10;

  this.getBlabla = function() {
    alert(blabla); // still here
  }
}