JavaScript – A Different Beast, Part-9: Literals and JSON

Previous topic in this series: Objects without Classes

This is the ninth part of my tutorial on JavaScript. Focus of this series is to introduce developers who are comfortable with other programming languages like Java or C to the idiosyncrasies of JavaScript. Basic JavaScript knowledge is assumed, but is not necessary as the code samples are simple and self-explanatory. If you are new to JavaScript, I would suggest going through the topics below in the order given.

Topics:

  1. A different beast
  2. Types and Type Conversion
  3. Functions
  4. Scopes and Scope Chain
  5. Closures
  6. Objects without Classes
  7. Inheritance without Classes
  8. Array, Map and the for..in loop
  9. Literals and JSON (You are here)
  10. Meta-Programming, Exceptions and Module Pattern

JSON is the preferred messaging format of the web these days. JSON has its origin in the object and array literals in JavaScript. This post will discuss literals first and the move onto its textual cousing – JSON.

Literals

A literal is a notation for representing a fixed value in source code. Literals for string, character and numbers are present in almost all programming languages. JavaScript has literals for all primitive types and for arrays and objects too. Code below shows all the literals in JavaScript.

//Code showing Literals
//primitive literals
var name = ‘humpty’;  //string literal
var age = 10; //number literal
var fat = true; //boolean literal
//array literal
var hobbits = [‘frodo’, ‘bilbo’, ‘pippin’, ‘merry’ ];
//object literal
var agent = {
 lastname : 'bond',
 firstname : 'james',
 code : '007'
}

All these literal notations can be used together with nesting to represent complex data structures. Following code shows the literal for a customer record.

//Code – 4.5 Complex Literal
var cust1= {
     firstName: "John",
     lastName: "Smith",
     age: 25,
     address:
     {
         streetAddress: "21 2nd Street",
         city: "New York",
         state: "NY",
         postalCode: "10021"
     },
     phoneNumber:
     [
         {
           type: "home",
           number: "212 555-1234"
         },
         {
           type: "fax",
           number: "646 555-4567"
         }
     ]
 }
console.log(cust1.age); //25
console.log(cust1.address.city); //nested object's property
var num = cust1.phoneNumber[1]; //accessing array
console.log(num.type, num.number); //array element is an object

Note: A literal notation for date data type is conspicuously missing. It would have made a full deck.

Advertisements

About Rahul Mohan

Technical researcher interested in model-driven development of enterprise business applications. Passionate about web technologies and a huge admirer of open-source especially in the Java landscape. When I am not doing any of the above you can find me with my camera (www.flickr.com/photos/rahulmohan/) or listening to music. (In fact, the title of the blog is inspired by Led Zeppelin's Physical Graffiti. )

Posted on June 19, 2011, in JavaScript, Tutorial and tagged , , , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: