Share

More JSON goodness! While doing my tests using the Jasmine framework I started noticing in my code that the data I was submitting needed to be serialized from a JavaScript object to a JSON representation. One would think that this might be real easy but alas, it seems that only the newer versions of the browsers implement the stipulated methods to serialize the object.

Even everybody's favourite JavaScript library, JQuery, doesn’t implement a mechanism to do this. (check out http://stackoverflow.com/questions/2277405/json-stringify-missing-from-jquery-1-4-1 for further discussions and http://api.jquery.com/category/utilities/ for confirmation)

So I started going through posts and pointers from other developers. The first set of posts I read used a customised mechanism of serializing the object (http://blog.stchur.com/2007/04/06/serializing-objects-in-javascript/ and http://www.sitepoint.com/javascript-json-serialization/). While this looks very cool I wasn’t willing to replicate the functionality just in case I missed something.

Then I came across http://www.json.org/js.html which defined a mechanism to do what I needed but I still wasn’t convinced. So after a while of reading I came across (http://stackoverflow.com/questions/2277405/json-stringify-missing-from-jquery-1-4-1 –> last post which points to http://code.google.com/p/jquery-json/). HOOAH! This did exactly what I wanted and wrapped it up nicely.

So off I go implementing the methods using the functions provided in jquery-json. The more I did, the less I liked it. The code was starting to smell a bit. So instead of doing the the following over and over and over:

   1: //Convert to JSON string

   2: var jsonString = $.toJSON(myObject); 

I decided it would probably be better to wrap the entry point into this mechanism into a single entry point for my application. Allowing me to swop out the implementation if need be without having to remove/rename a stack of references. So it ended up looking like this.

   1: //Back to my handy helper class :)

   2: function Helper() { }

   3:  

   4: //Convert JSON to object

   5: Helper.getObject = function (jsonString) {

   6:     return $.evalJSON(jsonString);

   7: }

   8:  

   9: //Convert object to JSON

  10: Helper.getJson = function (object) {

  11:     return $.toJSON(object);

  12: }

A great deal of people might think this is over complicating it, adding an unnecessary layer etc. I would argue that it decouples my dependency on the jquery-json library or at least isolates it’s usage to one location. As pointed out previously, should I need to call a different library I would only have to change it in one file. Nothing really fancy about the code but might spark other ideas. The jquery-json library also implements a secureEvalJSON which seems to prevent possible abuse of the JSON returned. With that being said I am going to change my getObject implementation to use it

References:

http://code.google.com/p/jquery-json/

http://www.metaltoad.com/blog/using-jsonp-safely – interesting post on JSONP security

Tweet