Scope Closures - The Story of a Functional Building

Scope Closures

The Story of a Functional Building

In this photo the ground represents the global scope and the terraced building represents a group of nested functions. To put it in code form we could represent it like this:

A Functional Building

var ground = "I am global";

(function firstFloor (){

  function secondFloor (){

    function thirdFloor(){

      function andSoOn (){

       // etc to the top floor
      }
    }
  }
})();

You will notice that the innermost function represents the highest floor.

Now imagine you were standing on the second floor terrace. Now what will you be able to see (called scope) from that vantage point?

You will be able to scope everything on the terrace you are standing on. Also you will be able to scope the first floor terrace and the ground floor. But you will not be able to scope anything on any of the floors above you (for obvious reasons).

Scope in JavaScript works exactly the same.

Have a look at the following code:

What can you Scope from here?

You see Scope is basically just what you would be able to see if you were standing on our terraced building. You can see everything on your level and down, but not up.

Closure

We said scope is what you can see while standing on a terrace in our functional building. So to use this analogy, what would closure be?

Imagine you are on holiday here and you take photographs of all you can scope from your rooms terrace. Now when you return home what will you be able to scope while looking at the photographs you have taken?

Yes. The same as if you were still standing there. You will be able to scope the red car, the pool, and everything on the terrace. Even though you have returned home.

Photograph

function firstFloor(){
  var pool = "A swimming pool";

  function secondFloor(){
    var you = "You are here";

    console.log(pool);
  }
  return secondFloor;
}

var photo = firstFloor();

photo(); // A swimming pool

So Closure in JavaScript basically means it is when a function (you) can remember what it has scoped even when it is called to remember outside its lexical scope (the terrace it was on).

Modules

A module is very similar to the above exanple. All the rules of scope and closure apply. The main difference here is that the function needs to be invoked first and usually an object with references to the functions (terrace floors) are returned.

You could say you return home with a scale model of the hotel.

Take a look at the example below.

An Object to Remember

Thanks for the visit

Next time somebody asks you about Scope or Closures just think back and remember the time you spent here with me in a functional building.