Wednesday, March 28, 2012

Javascript Date return NaN in IE 8

Well, UTC suppose to be universal date-time format, but when I do Date.parse() or new Date() with UTC string in IE8, it returns null / NaN  ( while all the browser, including IE9, works ).  Well, it turns out that IE 6 - 8 doesn't understand UTC date-time format :)  Not surprise though, it is IE after-all.

This website has a metrics of javascript Date support for all browsers, pretty handy.

One of the solutions is to override Date.parse() when the browser is an IE.

Tuesday, March 27, 2012

Javascript Constructor return rules

Tonight we have a student asked about what if we return a primitive types in a constructor function, like the below:

function Person() { = "Roy";
   return "abc";

What would be the return if we instantiate this constructor?

var me = new Person();
console.log(me); // what would you expect to see??

The result is you will get an instance of "Person".  Some people may question "the return was a string, how come it still return an instance of Person?"   Well, it is all related to the "new" keyword.

Whenever you instantiate a constructor ( or a Class ) using "new" keyword.  The javascript interpreter will enforce you to return an object.  If you do not return an object ( just like the above ), the javascript interpreter will enforce this rule by returning an instance of a current constructor.

So it will be similar to the following:

function Person() { = "Roy";
   return this;
   //return "abc";

However, if you define an object at the return, the javascript interpreter won't care about it.

function Person() { = "Roy";
   return { name: "Joyce" };

The above code works because it is returning an object, but it won't be an instance of Person.

So, remember, if you return a "primitive types" in a constructor, when you instantiate the constructor with a "new" keyword, you will always get the instance of the Constructor back.  However, if you return an object, you won't have any issue.

Wednesday, March 21, 2012

Javascript Garbage Collection

There's a student yesterday asking about garbage collection in Javascript.  And here it is how it works from  a high level perspective.

Memory is allocated to objects when they created and reclaimed by the browser when there are no more reference to it.  A garbage collection is a mechanism that saved developer time or effort from explicitly performing memory management task and its main duty is to  determine when it is safe to reclaim the memory.   Of course, if an item is still being referenced or being used, it won't collect those memory.   It only collects the memory from objects that are no longer reachable or referenced.

But how does that works?  Well, most garbage collection is using different variants of "Mark-and-Sweep" method/algorithm.  In Javascript, it travsed periodically all the variables and objects and mark items that are still being used or referenced. And it follows with the "sweep" step, it sweep any "unmark" items and reclaim the memory back by deallocating those.

Ok, so how does those information help us?  

In Javascript, global scope variables are not garbage collectable and presenting opportunity for a memory leak, and it explains why we need to limit the usage of global variables in our program.  ( There are many reasons why you should limit the use of global variables, this is just one of the reasons ).

Whenever you create an object using a "new" statement, use a delete statement to explicitly destroy it when it is no longer needed.  This step ensures the memory of that object will be available to the garbage collection.

There is a blog post more on this topic:

Tuesday, March 20, 2012

HTML5 Community Night

5:00 - 6:00 pm      Registration, Demo showcase, Social, food, drink
6:00 - 6:30 pm      Kick off  (Doris Chen, Ann Burkett, Kevin Nilson)
6:30 - 7:10 pm      The Graphical Web - Fostering Creativity (Adobe: Vincent Hardy)
7:10 – 7:50 pm      Dart (Google: Seth Ladd)
7:50 – 8:00 pm      break
8:00 - 8:20  pm     WebFWD (Mozilla: Diane Bisgeier)
8:20 - 9:00  pm     Behind The Scenes of Cut The Rope (Microsoft: Giorgio Sardo)
9:00 - 9:30 pm      Panel Discussion & Q&A (Kevin Neilson, Vincent, Seth, Giorgio)
9:30 - 9:40  pm     Give Away and Wrap