Binding of CoffeeScripts Fat Arrow

Again this is a frequently asked questions on StackOverflow. I have already answered it there however I think its hard to find.
So I will reproduce it here again.

When does the fat arrow bind?

The fat arrow binds at 3 occasions

• when declaring a method within a class
• when declaring a function within a method or function
• when declaring a function in global context

Declaring a method within a class

When the Coffeescript compiler encouters the following syntactical pattern within a class declaration

This will yield the following code within the constructor of class A

Within the constructor of A somemethod is now called via apply using _this.
So regardless which context you call somemethod it will allways use the creating instance as the execution context.

When declaring a function within a method or function

When you define a function with a fat arrow within a method or function the Coffeescript compiler automatically creates a closure and and shadows this of the outer method into the variable _this. Any reference to @ within the inner function will use the variable _this in the generated javascript code.

A definition of a function without the fat arrow doesn't create that closure for you.

When declaring a function in global context

If you define a free floating function (meaning as a method in a class and not within another function/method) just like this

Then the corresponding Javascript will look like this

The interesting thing here again is that this is being assigned to _this which enables the definition of foo to close over _this.
The important part however is that this is now always the global context of your execution environment. If you are in the browser it will be the window object. If you are running node.js it will be the module you are just running.
Warning: You shouldn't define any function accessing your global context anyway. This calls for trouble.
Did you find this entry useful? Please upvote it on StackOverflow.

About Closures And Loops

A frequently asked questions on StackOverflow is why the value of a variable that a function closes over isn't the value the programmer expects but another one. Usually this kind of question comes in combination with loop. Lets have a look on an example

The expected outcome of this would certainly be 1,4,9 but its 16,16,16.

What went wrong?

Less experienced programmers might think that creating a closures somehow copies the values of the accessed context during the creation of that closure. However that is not true.

What really happens!

When a function closes over a surrounding context it saves a reference to that enclosing context - that includes all variables within that context.
Now when accessing the context and its variables one gets the state of that context as it is at the time of access and not as it was during the creation of the closure.
In this specific case the value of the variable >>i<< after the finishing the first loop is 4. When executing the functions within the second loop its still 4.

What is the solution?

What you need is a way to create different context for each of the functions that you create.
The best way is to define a function that returns a function as a result. The returned function again closes over the defining function and its variables and parameters.

This will yield the expected outcome of 1,4,9.