Scope in JavaScript (Learning is fun)

What would you expect when you ran the following code JS snippet ?

if (true) {
var x = 69;
}
alert(x);

Today I found out some interesting things about scope in JavaScript. At the moment I’m reading the book Secrets of the JavaScript Ninja and in the chapter I’m reading they are going back through the fundamentals of functions.

Here is one of the points made is around variables, functions and their scope:

  • Variable declarations are in scope from their point of declaration to the end of the function within which they’re declared, regardless of block nesting.
  • Named functions are in scope within the entire function within which they’re declared, regardless of block nesting. (Some call this mechanism hoisting.)
  • For the purposes of declaration scopes, the global context acts like one big function encompassing the code on the page.

The code at the top will actually alert 69 when run. This came as a bit of a shock for me because from my background of C# / Java I have always assumed x would have been out of scope due to the block level context of how those languages work. When executed i expected to see a healthy null alerted.

This whole time I have made the assumption that these same rules from my experience with C# applied with JavaScript. This realisation that part of the fundamentals of what I have learnt is a little flawed is a little humbling but it really opens your eyes to what you are re-learning and quite honestly it’s awesome.

I can’t believe I have been using JavaScript for so long and have never picked this up. I guess the situation never came up in anything I’ve written (or it has and no one has found it yet). Sure the situation would rarely come up and it’s not like what you are doing is wrong, you just don’t feel like an expert anymore and that’s the humbling part so it’s bitter-sweet.

I KNOW KUNG FU

The great thing is at the moment i feel like Neo (Matrix Movie) when he’s in the chair and Link just ran the procedure to push Kung Fu 1.0 into his head, this will definitely change the way i write JavaScript.

I guess its another notch on the sword on the way to ninja status….

Or maybe I’m just holding the sword the right way round now :)

Advertisement

RELAX, leave backbone alone

I have been playing with backbonejs and CouchDB in my (limited) spare time to see how usable they are together.

Well I have a backbone collection and figured I would fetch a couch view into the collection. Now backbone expects an JSON array and couch gives you a single JSON object that has total and a rows etc.

Image

Hmm…

I started to look around for someone on git that may have done this, not much luck. There were a couple of customisations that have been written but there were a few issues with using the latest backbone release.

I figured I’d start writing my own backbone extension that overrides the sync and fetch functions. I had already done a simple OData JSONP extension for work so I got started.

Then something in the back of my mind said ….list….

I realised you didn’t need to modify backbone, I could use a list function in couch. I even found someone on stackoverflow that had already written one (WIN)

ImageThe more I think about it couch is designed to do things like this, it will add in etags to help cache the list and I can even modify the list to handle different content types.

Hope this helps in some way.

Decisons

I love programming, I spent a small part of Christmas Day playing with backbone.js. I did a lot more other things like eating and being merry but programming seems to be escape for me.

Occasionally I look back on the toolkits / frameworks / APIs I have used and wonder am I doing the right thing here by using this framework. Is what I build now going to be supportable, easy to maintain and (hopefully) expandable, not just the app I write but what my app is built on.

Take this picture of a 1930s (i think) car stacker for example

great idea

At the time I’m sure the inventors and engineers who built this thought it was a great idea. I’m sure the guys were patting themselves on the back and saying things like ‘Look how much more efficient this is…’. And it is a great idea.

But why don’t you see these on the side of 20 storey buildings in the city? Instead you see undercover parking under those buildings or large parking lots that you drive into, they take up way more space and you have to search for your car. There may be a couple in lavish areas of a city, but it isn’t a common sight.

This leads me to my dilemma. Sometimes I start playing with a new technology and I wonder if this is going to last. Should I invest my time in figuring out how to use this framework or am I better off sticking with what I know.

It’s a scary thought because the idea illustrated in the picture seems like it should be a winner. But I’m sure limiting factors like the cars weight, shape, size and not to mention how do you get your car when the machine is broken, have all contributed to this idea being put in the ‘forget’ tray. And probably for good reason.

It’s a hard to think ahead and question the viability of a framework. Long lasting ramifications are always the result of these sorts of decisions, both for you and for people that hire / depend on you. The funny thing is there is no wrong or write answer, it’s just a decision you need to make.

I will play and tinker with a framework until it ticks all the boxes for me. Then I will encourage my colleges and friends to play with the framework and we discuss what are the good and bad points and see if it does everything need.

The big part is looking for evidence to say ‘this will save us in the long run’. This can be very difficult because no one knows what the future brings but as you gain experience hopefully this knowledge makes your decisions easier.

Always think about what you are looking at, is this new product going to truly save you time in your environment or should this salesman peddle his wares elsewhere.

Good luck.

Help on learning Backbone.js

Just discovered this awesome site called codeschool and they have this section for learning backbone.js

The ui gets you to type in the code and it marks your code as you go. What makes this really really awesome is that you gain experience and level up. Finally someone is capitalizing on those coders who spent years playing RPGs (Final Fantasy was my poison).

It’s a really nice UI and you have the reading material available as you go. All you need to do is type and get the correct answer.

I think i’m going to use this more often :)