JSON JavaScript

JSON est un format de stockage et de transmission des données.

JSON est souvent utilisé lorsque les données sont envoyées du serveur vers une page web.

Qu'est-ce que JSON ?

  • JSON est une abréviation de JavaScript Object Notation JjavaSscript Oobjet Notation
  • JSON est un format de données léger pour l'échange de données
  • JSON est indépendant des langages *
  • JSON est "auto-descriptif" et facile à comprendre

* La syntaxe JSON est dérivée de la syntaxe des symboles d'objet JavaScript, mais le format JSON est un texte pur. Le code pour lire et générer des données JSON peut être écrit dans n'importe quel langage de programmation.

Exemple JSON

La syntaxe JSON définit un objet employé : un tableau (objet) contenant trois enregistrements d'employés :

Exemple JSON

{
"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"},
    {"firstName":"Alan", "lastName":"Turing"}
]
}

Le format JSON est évalué comme un objet JavaScript

Le format JSON est grammaticalement identique au code pour créer des objets JavaScript.

En raison de cette similitude, un programme JavaScript peut facilement convertir des données JSON en objets JavaScript locaux.

Règles de syntaxe JSON

  • Les données sont des paires nom/valeur
  • Les données sont séparées par des virgules
  • Les accolades conservent les objets
  • Les crochets conservent les tableaux

Données JSON - Noms et valeurs

Les données JSON sont écrites sous forme de paires nom/valeur, comme les propriétés d'un objet JavaScript.

Les paires nom/valeur sont constituées de noms entre guillemets doubles, suivis d'un deux-points, puis de la valeur :

"firstName":"Bill"

Les noms JSON doivent être entre guillemets doubles. Les noms JavaScript n'ont pas besoin de cela.

Objet JSON

Les objets JSON sont écrits entre accolades.

Comme JavaScript, un objet peut contenir plusieurs paires nom/valeur :

{"firstName":"Bill", "lastName":"Gates"}

Tableau JSON

Les tableaux JSON sont écrits entre crochets.

Comme JavaScript, un tableau peut contenir des objets :

"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"}, 
    {"firstName":"Alan", "lastName":"Turing"}
]

Dans cet exemple, l'objet "employees" est un tableau. Il contient trois objets.

Chaque objet représente un enregistrement d'une personne (avec un prénom et un nom).

Convertir le texte JSON en objet JavaScript

L'utilisation habituelle de JSON consiste à lire des données à partir d'un serveur web et à afficher ces données dans une page web.

Pour simplifier, vous pouvez utiliser une chaîne en tant qu'entrée de démonstration.

Tout d'abord, créez une chaîne JavaScript contenant la syntaxe JSON :

var text = '{ "employees" : [
'{ "firstName":"Bill" , "lastName":"Gates" },' +
'{ "firstName":"Steve" , "lastName":"Jobs" },' +
'{ "firstName":"Alan" , "lastName":"Turing" } ]}';

Ensuite, convertissez cette chaîne en objet JavaScript en utilisant la fonction intégrée JSON.parse() de JavaScript :

var obj = JSON.parse(text);

Enfin, utilisez ce nouveau objet JavaScript dans votre page :

Exemple

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>

Essayez vous-même

Vous pouvez essayer sur notre Tutoriel JSON En savoir plus sur JSON en lisant la page.