Définititon

JSON est un format de poids léger d'échange de données. Il est facile pour l'homme de lire et d'écrire. Il est facile pour les machines à analyser et générer.
Il est basé sur un sous-ensemble du langage de programmation JavaScript, Standard ECMA-262 3eme édition - Décembre 1999.
JSON est un format de texte qui est totalement indépendant de la langue, mais utilise des conventions qui sont familiers aux programmeurs de famille C de langages, dont C, C + +, C #, Java, JavaScript, Perl, Python, et bien d'autres.
Extension de fichier JSON est. Json Ces propriétés font de JSON un idéal linguistique d'échange de données. 

Les Structures de JSON

JSON est construite sur deux structures

• Une collection de paires de nom/valeur. Dans plusieurs langagesceci est réalisé comme un objet, record, struct, dictionnaire, table de hachage, la liste assortie, ou un tableau associatif.
• Une liste ordonnée de valeurs. Dans la majorité des languages ,ceci est réalisé sous forme de tableau, vecteur, liste, ou séquence.

Ce sont des structures de données universelles. Pratiquement tous les langages de programmation modernes les soutiennent sous une forme ou une autre.
Il est logique qu'un format de données qui est interchangeable avec les langages de programmation aussi être fondée sur ces structures.

Les Formes de JSON avec des exemples

En JSON, les structures prennent les formes suivantes

• Un objet (Object), qui est un ensemble de couples nom/valeur non ordonnés. Un objet commence par { (accolade gauche) et se termine par } (accolade droite). Chaque nom est suivi de : (deux-points) et les couples nom/valeur sont séparés par , (virgule). 
  
  

myObject = {
	"first": "John",
	"last": "Doe",
	"age": 39,
	"sex": "M",
	"salary": 70000,
	"registered": true
}
myObject.salary returns 70000

myObject["salary"] returns 70000

• Un tableau (Array) est une collection de valeurs ordonnées. Un tableau commence par [ (crochet gauche) et se termine par ] (crochet droit). Les valeurs sont séparées par , (virgule). 
  
  

myArray = [ "John Doe", 29, true, null ]
myArray = [ [], {} ]
myArray[2] returns true

Array with objects (Tableau avec Objet)

myArray = [
	{ "name": "John Doe", "age": 29 }, 
	{ "name": "Anna Smith", "age": 24 }, 
	{ "name": "Peter Jones", "age": 39 }
]
myArray[0].name returns John Doe

Object with nested array (Objet avec Tableau imbriquée)

myObject = {
	"first": "John",
	"last": "Doe",
	"age": 39,
	"sex": "M",
	"salary": 70000,
	"registered": true,
	"interests": [ "Reading", "Mountain Biking", "Hacking" ]
}
myObject.interests[0] returns Reading

myObject["interests"][0] returns Reading

Object with nested object (Objet avec Objet imbriqué)

myObject = {
	"first": "John",
	"last": "Doe",
	"age": 39,
	"sex": "M",
	"salary": 70000,
	"registered": true,
	"favorites": {
		"color": "Blue",
		"sport": "Soccer",
		"food": "Spaghetti"
	} 
}
myObject.favorites.food returns Spaghetti

myObject["favorites"]["food"] returns Spaghetti

Object with nested arrays and objects (Objet avec Tableaux et Objets imbriqués)

myObject = {
	"first": "John",
	"last": "Doe",
	"age": 39,
	"sex": "M",
	"salary": 70000,
	"registered": true,
	"interests": [ "Reading", "Mountain Biking", "Hacking" ],
	"favorites": {
		"color": "Blue",
		"sport": "Soccer",
		"food": "Spaghetti"
	}, 
	"skills": [
		{
			"category": "Javascript",
			"tests": [
				{ "name": "One", "score": 90 },
				{ "name": "Two", "score": 96 }
			] 
		},
		{
			"category": "CouchDB",
			"tests": [
				{ "name": "One", "score": 79 },
				{ "name": "Two", "score": 84 }
			] 
		},
		{
			"category": "Node.js",
			"tests": [
				{ "name": "One", "score": 97 },
				{ "name": "Two", "score": 93 }
			] 
		}
	]
}
myObject.skills[0].category returns Javascript

myObject["skills"][0]["category"] returns Javascript

myObject.skills[1].tests[0].score returns 79

myObject["skills"][1]["tests"][0]["score"] returns 79

• Une valeur (Value) peut être soit une chaîne de caractères entre guillemets, soit un nombre, soit true ou false ou null, soit un objet soit un tableau. Ces structures peuvent être imbriquées. 
  
  

• Une chaîne de caractères est une suite de zéro ou plus de caractères Unicode, entre guillemets, et utilisant les échappements avec antislash. Un caractère est représenté par une chaîne d'un seul caractère. Une chaîne de caractères est très proche de ses équivalents en C ou en Java. 
  
  

• Un nombre est très proche de ceux qu'on peut rencontrer en C ou en Java, sauf que les formats octal et hexadécimal ne sont pas utilisés. 
  
  

Number

var myNum = 123.456

var myString = "abcdef"

var myBool = true

var myArray = [ "a", "b", "c", "d" ]

var myObject = { "id": 007 }

var myNull = null

JSON vs XML

• JSON est comme XML parce que:

1. Ils sont à la fois «autodescriptif» ce qui signifie que les valeurs sont nommés, et donc «lisible»
2. Les deux sont hiérarchiques. (c'est à dire Vous pouvez avoir des valeurs dans des valeurs.)
3. Les deux peuvent être analysés et utilisés par de nombreux langages de programmation
4. Les deux peuvent être passés en utilisant AJAX (c.-à HttpWebRequest)

• JSON est différent de XML parce que:

1. XML utilise des crochets angulaires, avec un nom de balise au début et à la fin d'un élément: JSON, utilise les accolades avec le nom seulement au début de l'élément.
2. JSON est moins verbeux donc il est certainement plus rapide pour les humains à écrire, et probablement plus rapide pour nous de lire.
3. JSON peut être analysée en utilisant la procédure de trivialement eval () en JavaScript
4. JSON comprend les réseaux {où chaque élément n'a pas de nom à lui même}

Exemple: en format XML

{
<person>
  <firstName>John</firstName>
  <lastName>Smith</lastName>
  <age>25</age>
  <address>
    <streetAddress>21 2nd Street</streetAddress>
    <city>New York</city>
    <state>NY</state>
    <postalCode>10021</postalCode>
  </address>
  <phoneNumbers>
    <phoneNumber type="home">212 555-1234</phoneNumber>
    <phoneNumber type="fax">646 555-4567</phoneNumber>
  </phoneNumbers>
</person>
}

Ajax avec JSON

L'idée générale est d'offrir un peu de texte (une chaîne), qui peut être interprété comme un objet JavaScript.
Une fois qu'il arrive, vous utilisez la méthode eval () de JavaScript pour convertir la chaîne en un objet réel JavaScript, ce qui vous donne une lecture.

Exemple Ajax et retour en JSON

• Code en Ajax:

{
function setDataJSON(req)
{
	var data = eval('(' + req.responseText + ')');
	for (var i=0;i<data.books.length;i++)
	{
		var x = document.createElement('div');
		x.className = 'book';
		var y = document.createElement('h3');
		y.appendChild(document.createTextNode(data.books[i].book.title));
		x.appendChild(y);
		var z = document.createElement('p');
		z.className = 'moreInfo';
		z.appendChild(document.createTextNode('By ' + data.books[i].book.author + ', ' + data.books[i].book.publisher));
		x.appendChild(z);
		var a = document.createElement('img');
		a.src = data.books[i].book.cover;
		x.appendChild(a);
		var b = document.createElement('p');
		b.appendChild(document.createTextNode(data.books[i].book.blurb));
		x.appendChild(b);
		document.getElementById('writeroot').appendChild(x);
	}
}
}

• Le serveur retourne cette chaine en JSON:
  

{
{"books":[{"book":
		{
		"title":"JavaScript, the Definitive Guide",
		"publisher":"O'Reilly",
		"author":"David Flanagan",
		"cover":"/images/cover_defguide.jpg",
		"blurb":"Lorem ipsum dolor sit amet, consectetuer adipiscing elit."
		}
	},
	{"book":
		{
		"title":"DOM Scripting",
		"publisher":"Friends of Ed",
		"author":"Jeremy Keith",
		"cover":"/images/cover_domscripting.jpg",
		"blurb":"Praesent et diam a ligula facilisis venenatis."
		}
	},
	{"book":
		{
		"title":"DHTML Utopia: Modern Web Design using JavaScript & DOM",
		"publisher":"Sitepoint",
		"author":"Stuart Langridge",
		"cover":"/images/cover_utopia.jpg",
		"blurb":"Lorem ipsum dolor sit amet, consectetuer adipiscing elit."
		}
	}
]}
}

References

Websites

• JSON.org
• JSON - Wikipedia, the free encyclopedia
• Understanding JSON: the 3 minute lesson
• The AJAX response: XML, HTML, or JSON?
• JSON Example
• Ajax Tutorial with JSON