Explain Closures to me like I am five

Hassan Sani on November 23, 2017

markdown guide
 

Your mom has offered to make you cookies whenever you want. All you have to do is bring her the ingredients. This sounds great, but what if you just want a couple cookies? You'll need to get the ingredients, bring them to your mom, and she'll bake a large batch of one kind. It'd be much nicer to have a few cookies on demand, and different kinds.

In your bedroom you have a magic lamp. You rub it and out pops a genie. You explain the problem and he gives you a solution. He creates a large magic box in the kitchen. He tells you how it works. You put all the ingredients in for chocolate chip cookies and your mom puts the recipe in. From the bottom pops out another much smaller box. It has a button on it and the label "Chocolate chip". You press the button and after a few moments and weird sounds a few chocolate chip cookies pop out of a slot on the side.

You're excited. In the big magic box you now add ingredients for oatmeal cookies and your mom throws in the recipe. Out the bottom pops a box labelled "Oatmeal". You press the button and get a few oatmeal cookies. Just to be certain you pres the "Chocolate Chip" button again and sure enough, it's still producing chocolate chip cookies.

You realize you can take these boxes wherever you want. You create a "Shortbread" box for your room. You make a "Ginger Snap" box by the TV. For good measure you create a "Peanut Butter" box for the back of your bike. This is great!

You get a bit curious though, how do they work? You ask the genie. He waves his hands a lot and calls the little box a "closure". Basically it's a combination of the recipe (instructions) and ingredients (data) needed to make some cookies. It might even be somehow magically connected to the big box in the kitchen, where the stove is, but you don't need to know for sure. Really, how it was created doesn't interest you anymore so long as the little box keeps creating cookies.

For a non-ELI5 explanation please see What is a closure

 

You are born in a room.

For the rest of your life you're only allowed to eat foods that were in the room you were born in.

If there's a window in your room and there are foods in the room behind the window, you can eat those too.

You can try to eat other foods but you'll get told-off if you do (oh, and you won't get the food, no matter how hard you try)

  • Birth is function definition / creation.
  • Food is variables (reference to values)
  • Rooms are functions (and their enclosing scope (food))
  • Windows are reference to other functions in scope.
 

A 5 year old may not understand this unless he/she has an understanding of global variables.

Take this piece of code

var a = 0;

function increment() {
    a += 1;
}

function decrement() {
    a -= 1;
}

Both the functions can use the variable 'a' since its global. But what if you want to exclusively use it for one of the methods. How can you do that? Well closures make that possible. Its a global variable but only that function can access and write on it.

function addOne() {
    var a = 0;
    return function () {return a += 1;}
};
var increment = addOne();

increment() // after this a's value will be 1
increment() // a will be 2

Here 'a' is a global variable but only increment function has access to it. There is nothing more to closure.

 

A closure is a bit like a time capsule: the things you have put into it will be the same even if outside of it things change. The interesting thing in programming is that this time capsule will create a perfect copy, so you can still use whatever you put into it elsewhere.

So let's say you have a program that will snap a picture of each passing car and writes its license plate on a blackboard to be checked against a list of stolen cars. Unfortunately, the program that does the check is a bit slow, so a lot of licenses get overwritten in the meantime. "Not on my watch!", you think and go to find a solution.

To solve the problem, you use this trusty time capsule called "closure" to make perfect copies of the blackboard every time a license is read to be checked against the list. Even though the blackboard changes a lot of times, the copy inside the capsule that gets send to the list check remains the same. Now no stolen vehicle will go unnoticed and thus you saved the day!

 

You have a robot kit.

Inside the kit, you an instruction guide and some materials to build the robot, such as screws, metal frames, and a motherboard.

The instruction guide tells you how to use the kit's material to build the robot. But the instruction guide also notes that you need some things that are not included in the kit such as, batteries and a computer, to get the robot up and running.

You follow the kit's instruction guide, use the kit's materials and the not included materials to build a cool robot.

In this case: the closure is the whole robot kit (instruction guide and included materials) + not included materials.

So:

  • The robot kit is the function object (functions are objects in JS)
  • The instruction guide is the function's code that runs when it is invoked
  • The materials included in the kit are the variables/functions declared and used in the function's code
  • The material not included in the kit are variable/functions that are used inside the function's code but was not declared there

So a closure is a function object (code and variables declared in function ) + references variables that are used in the function's code but were declared outside the function

code of conduct - report abuse