The following excerpt is from Javascript Patterns. The author explains the use of JSON, gives a few words of advice, and provides a handful of examples.

---

Let’s take a look at JSON, which stands for Javascript Object Notation and is a data transfer format. It’s lightweight and convenient to work with in many languages, especially in Javascript.

There’s actually nothing new to learn about JSON. It’s only a combination of the array and the object literal notation. Here’s an example of a JSON string:

{"name": "value", "some": [1, 2, 3]}

The only syntax difference between JSON and the object literal is that property names need to be wrapped in quotes to be valid JSON. In object literals the quotes are required only when the property names are not valid identifiers, for example, they have spaces {"first name": "Dave"}.

In JSON strings you cannot use functions or regular expression literals.

Working with JSON

As mentioned in the previous chapter, it’s not recommended to blindly evaluate any JSON string with eval() because of the security implications. It’s best if you use the JSON.parse() method, which is part of the language since ES5 and is natively provided by the Javascript engines in modern browsers. For older Javascript engines, you can use the JSON.org library (http://www.json.org/json2.js) to gain access to the JSON object and its methods.

// an input JSON string var jstr = '{"mykey": "my value"}'; // antipattern var data = eval('(' + jstr + ')'); // preferred var data = JSON.parse(jstr); console.log(data.mykey); // "my value"

If you already use a Javascript library, chances are that it comes with a utility to parse JSON, so you may not need the additional JSON.org library. For example, using YUI3, you can do:

// an input JSON string var jstr = '{"mykey": "my value"}'; // parse the string and turn it into an object // using a YUI instance YUI().use('json-parse', function (Y) { var data = Y.JSON.parse(jstr); console.log(data.mykey); // "my value" });

In jQuery, there’s the parseJSON() method:

// an input JSON string var jstr = '{"mykey": "my value"}'; var data = jQuery.parseJSON(jstr); console.log(data.mykey); // "my value"

The opposite of JSON.parse() method is JSON.stringify(). It takes any object or array (or a primitive) and serializes it into a JSON string.

var dog = { name: "Fido", dob: new Date(), legs: [1, 2, 3, 4] }; var jsonstr = JSON.stringify(dog); // jsonstr is now: // {"name":"Fido","dob":"2010-04-11T22:36:22.436Z","legs":[1,2,3,4]}