Skip to main content

Posts

Showing posts from May, 2011

Javascript in all its weirdness: Immediate functions

What does this line do? var x = ( function() {     return "name"; }()); This is called an immediate function in Javascript. It looks like x will become a function, but in fact, it is assigned the value "name", the return value of executing the anonymous function. Immediate functions are nice for one time work, such as setup, because (a) you won't have to create an object or function that lingers, as it is one time code, and (b) you protect the global scope from being written to, because all the variables in this functions are local. Here is how to pass arguments to immediate functions var x = ( function(arg1) {     return arg1 + "name"; }("my")); // returns "myname" You can assign immediate fuction restuls to a property of an object such as in var p = { name:   ( function() {                           return "aname";}() ); }; Finally, here is how to pass the global object to it, so you can still a

Javascript in all its weirdness: What is 'this' ?

The this pointer, people's favorite in languages including Javascript was a great source of pain for me when I was developing a Javascript drop down custom component. I learned today that it was 'this' that caused me problems! Generally, 'this' refers to the global object. It also takes on different values based on your scope/context. -In a global constructor, global function and global code, this refers to the global object ( the first should not be the case in strict mode in ECMAScript5) -In a method of an object, 'this' refers to the object // this pointer name='what?'  // same as this.name var p = function () {      console.log(this.name);  // changes the global name, as no var name is defined locally      name = 'again?';      console.log(this.name); } p(); // the global this.name was modified by the function p // Why? because p is a global function, // and this refers to the global object in that function console.log

NoSQL Databases - MongoDB first cut

A few days ago I tried MongoDB, my first encounter with what is called a NOSQL Database. No, it does not mean 'no' 'sql', rather Not only SQL, anyway I thought I would try mongodb, out of the many available there. It has both the document-oriented database design and ability to be accessed from Javascript, both features I really like. However, since I spend most time in Java, I thought I would start there. First, let me tell you you should try their web console before writing a line of code or downloading anything because it's a really good self-run tutorial, that lets you type real commands and get real output all from the browser! pretty awesome... Anyway, here is what I did to get started. 1. Download mongodb from http://www.mongodb.org/ 2. Create working dir for MongoDB to use as data directory 3. Open favorite IDE or editor, and start writing test, yes Test , not source, in the spirit of Test Driven Development. 4. In test package, create test such as:

Javascript in all its weirdness: Function hoisting (will spin your head!)

Unless you are a Javascript guru, or have read related stuff before, this will spin your head! To see this in action: Paste this into a "test.html" file and open in firefox, and open Firebug. Here, two functions a and b are defined, both using what are called 'function declaration syntax', much like a C/Java function. However, another function tries to redefine each of these locally. 'a' is redefined using a function declaration syntax, whereas b is redefined using a 'function expression' syntax (i.e., treating function like an expression and assigning it to a var called 'b'). Notice, how the entire defintion of 'a' is hoisted (pushed up to the top of the defining function), whereas only the variable name 'b' is hoisted, not its definition. See my other article on the basics of hoisting, if you are not familiar with it - "Javascript in all its weirdness - Hoisting" <script type="text/javascript"

Javascript in all its weirdness - Hoisting

This piece of code did not do what I expected, can you tell? // define a var x = 1; function changex() { console.log(x); // I expect this to print 1 var x = 2; // define a local var x console.log(x); // I expect this to print 2 } changex(); What do I actually get? undefined 2 Why the heck is x undefined for the first print? it turns out javascript does what is called "hoisting" meaning it collects all local variable definitions in one place before executing any function code. therefore the function is effectively doing this var x; // undefined console.log(x); // prints undefined x=2; console.log(x); // prints 2 This really got me the first time I read this References: Javascript patterns, Stoyan Stefanov

Javascript in all its weirdness: Constructors

Here is another one that has gotten me before, again ECMAScript 5 will take care of this mostly but until then it's tricky given an object defined like this var Obj = function(name) { this.name=name; }; What will the following do? var o = new Obj('anewwin'); console.log(o.name); As guessed, it will print 'anewwin' to the console How about this? var o = Obj('anewwin'); // No 'new' this time console.log(o.name); This time you get an error saying o.name does not exist. Why? Because Javascript interpreted 'this' inside the function as the global 'window' object instead. To prove this, add the following: console.log(window.name); // This prints 'anewwin' So, behind the scenes, in the absence of 'new', javascript is assigning 'this' to the global window object, thus causing confusion. ECMAScript 5 is supposed to stop assigning 'this' to the global object, for everyone's good. Until then, the recommend

Javascript in all its weirdness: Brace location

Today I learned something about Javascript that surprised me. No wonder I had been writing some really awful code, because I had not grasped many such oddities of my favorite language. Let me share with you a few oddities of Javascript as a language, which probably gives way too much leverage to a developer in my opinion. Location of opening braces What do you think the following will do? function func() { return { name: "AGuy" }; } console.log(func().name); You are probably guessing right, it will print AGuy on the Firebug (or other console) How about this: function func() { return { name: "AGuy" }; } console.log(func().name); The same output right? Nope. You get this! func() is undefined console.log(func().name); WTH? Why is that, just because I moved the brace to a new line? Java would have happily accepted this sort of daredevilry. It turns out Javascript inserts a semicolon if I don't put a brace on the same line, so t