Javascript variable lifecycle

Question

I'm learning Javascript and I cannot understand why this code works:

function getObj()
{
   var objAddress = 
   {
      address: "Client Address",
      getAddress: function() {
         return this.address;
      },
      setAddress: function(newAddress)
      {
         this.address = newAddress;
      }
   };

   var objClient =
   {
      name: "Client name",
      getAddress: function()
      {
         return objAddress.getAddress();
      },
      setAddress: function(newAddress) {
         objAddress.setAddress(newAddress);
      }
   };

   return objClient;
}

gObj = getObj();
console.log(gObj.getAddress()); // Will print "Client Address"
gObj.setAddress("xpto");
console.log(gObj.getAddress()); // Will print "xpto"

I thought it would not work since getAddress() calls another method of an object that should not exist after leaving the function. But, as this is working, I presume that the object objAddress still exists even after quiting the getObj function.

Outside the function, how can the gObj.getAddress() work?

What makes you think the method getAddress() calls doesn't exist? — JJJ
– JJJ, Commented Nov 4, 2013 at 15:20
I came from C/C++ and, mistankenly,I think that, after the return statement, all the local variables of the function will be deleted. So, the objAddress will be deteled also. — javlacerda
– javlacerda, Commented Nov 4, 2013 at 15:29

Zergatul · Accepted Answer · 2013-11-04 15:24:38Z

3

When you create function, which uses local variable, function "remembers" this local variable. All needed local variables are stored in special object called closure. You cannot directly access it, but function can. Chrome Developer Tools in javascript debug shows closure object: Closure in Chrome Developer Tools

answered Nov 4, 2013 at 15:24

Zergatul

2,0381 gold badge20 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

lonesomeday · Accepted Answer · 2013-11-04 15:23:08Z

1

This is called a closure. From the MDN page:

variables from the parent function of the closure remain bound from the parent's scope. (link)

That is to say, functions exist with a reference to the scope that they were defined in. As long as functions with a reference to the scope exist, the scope will exist.

answered Nov 4, 2013 at 15:23

lonesomeday

239k54 gold badges330 silver badges329 bronze badges

Comments

Ashkan Mobayen Khiabani · Accepted Answer · 2013-11-04 15:23:51Z

0

getObj is a closure and in here:

gObj = getObj();

gObj is an instance of that closure and so all functions and properties that are defined in that class is valid for oObj too.

answered Nov 4, 2013 at 15:23

Ashkan Mobayen Khiabani

34.4k35 gold badges112 silver badges187 bronze badges

Collectives™ on Stack Overflow

Javascript variable lifecycle

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related