Object-Oriented JavaScript: Part 3 | Page 3

Object-Oriented JavaScript: Part 3

By Cristian Darie, Bogdan Brinzarea

Introducing JSON

In AJAX applications, client-server communication is usually packed in XML documents, or in the JSON (JavaScript Object Notation) format. Interestingly enough, JSON's popularity increased together with the AJAX phenomenon, although the AJAX acronym includes XML. JSON is the format used by the Microsoft AJAX Library and the ASP.NET AJAX Framework to exchange data between the AJAX client and the server, which is why it deserves a quick look here. As you'll learn, the Microsoft AJAX Library handles JSON data packaging through Sys.Serialization.JavaScriptSerializer, which is described in the Appendix—but more on this later.

Perhaps the best short description of JSON is the one proposed by its official website: "JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate."

If you're new to JSON, a fair question you could ask would be: why another data exchange format? JSON, just like XML, is a text-based format that it is easy to write and to understand for both humans and computers. The key word in the definition above is "lightweight". JSON data structures occupy less bandwidth than their XML versions.

To get an idea of how JSON compares to XML, let's take the same data structure and see how we would represent it using both standards:

The same message, written in JSON this time, looks like this:

As you can see, they aren't very different. If we disregard the extra formatting spaces that we added for better readability, the XML message occupies 396 bytes while the JSON message has only 274 bytes.

JSON is said to be a subset of JavaScript because it's based on the associative array-nature of JavaScript objects. JSON is based on two basic structures:

Object: This is defined as a collection of name/value pairs. Each object begins with a left curly brace ({) and ends with a right curly brace (}). The pairs of names/values are separated by a comma. A pair of name/value has the following form: string:value.
Array: This is defined as a list of values separated by a coma (,).

We've mentioned strings and values. A value can be a string, a number, an object, an array, true or false, or null. A string is a collection of Unicode characters surrounded by double quotes. For escaping, we use the backslash (\).

It's obvious that if you plan to use JSON, you need to be able to parse and generate JSON structures in both JavaScript and ASP.NET, at least if the communication is bidirectional. JSON libraries are available for most of today's programming languages: ActionScript, C, C++, C#, VB.NET, Delphi, E, Erlang, Java, JavaScript, Lisp, Lua, ML and Ruby, Objective CAML, OpenLazslo, Perl, PHP, Python, Rebol, Ruby, and Squeak. When we said almost every programming language we were right, weren't we!

If you plan to work with JSON data outside of the Microsoft AJAX Library, you can use the library listed at https://www.json.org/js.html.

Summary

This chapter walked you through many fields. Working with OOP in JavaScript is certainly no easy task, especially if you haven't been exposed to the implied concepts before. Where you don't feel confident enough, have a look at the additional resources we've referenced. When you feel ready, proceed to Chapter 4, where you will have an overview of the architecture and features of the Microsoft AJAX Library.

[This is an excerpt from the book, Microsoft AJAX Library Essentials: Client-side ASP.NET AJAX 1.0 Explained, by Cristian Darie, Bogdan Brinzarea . Published by Packt Publishing Ltd., 2007]

Digg This Add to del.icio.us

[previous]

URL:

Object-Oriented JavaScript: Part 3 | Page 3