It took me a little while to get used to Erlang. It was a couple of days before I knew the syntax without looking at examples. Several more days before I knew what utility functions to expect, and what their parameters should look like. A month or two before gen_server and gen_supervisor clicked.
Even better - here's a quick example:
If you're as unfamiliar with this as I was, it's best if you reason for yourself why each line prints what it does. The basic idea is that the output "function:context" tells you what function is executing ("f" or "b.f"), and in which context ("global", "object-a", or "object-b").
If you've followed the example successfully, you can see that any function can be executed in such a way that this is whatever you want it to be. It doesn't matter if the function is defined "in" some other object; if it can be referenced, it can be applied to the object of your choice.
For example, try out this code (assuming you have both jQuery and firebug installed):
What you get is two "groups", with two buttons each. Each time you click a button, the name of the button, as well as the number of times it has been clicked are printed on the console. Just to make it a little more interesting, the name of the group, as well as the total number of clicks of buttons in that group are also printed.
Two closures give us local storage for click counts: the outer one closes over groupCount, while the inner one closes over buttonCount (and also over groupCount by transitivity, of course). jQuery's each function applies its argument to each element in the matched list, so this is set to each div in the outer iteration, and this is set to each button in the inner iteration. jQuery's click function registers its argument in such a way that the handler gets applied to the element that triggered the event, so this is once again set to each button element in the inner-most function.
The end result is four functions registered as click handlers, each attached to a different button, each closing over its own buttonCount, and two pairs of those functions closing over the same groupCount. When the handler is called, this is set to the button, and we can extract text from the page for logging.
Yes, this is a trivial, contrived example that's not good for much on its own, but this technique can be applied to any place a callback is used: iteration constructs and DOM events (as shown above), XHRs, Google Maps events, etc. Need to share a reference between several callbacks (or several executions of the same callback), but don't want to pollute your namespace? Closures are the answer. Need to know why your callback is being called? this to the rescue.
A coworker and I were discussing all of this the other day, when the question arose, "Why a magical this? Why not just use the calling convention that 'this' is the first parameter of the function?" Well, I'm still trying to come up with a good answer for that one. In truth, many libraries do also pass an argument to the callback function that is equal to this. My strongest feelings so far: standardization and syntactic sugar.
By standardizing that this always means this very specific thing, we dodged the bullet of some libraries supporting it, while others don't, while still others call it something else. Sometimes you just have to make a decision to ensure that it has been decided.
Without this defined as-is, the syntax for "applying foo's bar member to foo" becomes foo.bar(foo); why name foo twice? In addition, all function signatures now become function bar(this, x, y, z, ...), whether they're interested in this or not.
As I dive into playing more with prototypes, I expect to find additional interesting qualities to the use of this, but as yet, I can't speak to them.
* "Scheme is like Victoria's Secret: It's supposed to be elegant, but really it's just dirty," is printed next to my picture in my yearbook. I've since married the woman who said it, and learned the error of my ways. Likely not related events, but who can say for sure?
Post Copyright © 2009 Bryan Fink