Share
JSON (JavaScript Object Notation, que je prononce "Jason" et que vous pouvez prononcer comme vous le souhaitez) est un format de données textuel conçu pour être lisible par l'homme, léger et facile à transmettre entre un serveur et un client Web. Sa syntaxe est dérivée de JavaScript - d'où son nom - mais il peut être utilisé dans la plupart des langages, y compris AS3 et C #..
Si vous avez beaucoup programmé, vous avez déjà rencontré des tableaux: des ensembles d’éléments, chacun assigné à un entier spécifique.
En JSON, un tableau des six premières lettres de l'alphabet serait représenté comme suit:
["a B c d e F"]
Les codeurs AS3 et JavaScript trouveront la liste ci-dessus très familière. Cela ressemble à la manière de définir un tableau en C #.
Comme vous pouvez probablement le deviner, les crochets indiquent "ceci est un tableau" et les virgules servent à séparer différents éléments (notez qu'il n'y a pas de virgule après l'élément final). En supposant que la langue dans laquelle vous analysez le JSON utilise des tableaux à base zéro (et combien de langues ne pas, ces jours?), l'élément 0 sera "a", 1 sera "b", 2 sera "c", et ainsi de suite.
Pour faciliter la lecture des tableaux, nous les écrivons souvent avec des retours à la ligne et des indentations supplémentaires:
[ "a B c d e F" ]
Notez qu'il n'y a toujours pas de virgule après l'élément final, donc ça a l'air un peu bizarre.
Il n'est pas nécessaire d'utiliser des chaînes en tant qu'éléments d'un tableau JSON; on peut aussi utiliser des chiffres, vrai, faux, et nul. Il n'y a pas de typage strict, ce qui signifie que vous pouvez mélanger les types de valeurs que vous utilisez dans un tableau donné. Par exemple, ceci est parfaitement valide:
["pomme", 3, 912, null, -7.2222202, "#", vrai, faux]
Notez que vous devez utiliser des guillemets doubles (") pour entourer toutes vos cordes; Guillemets simples (') ne sont pas permis. Oui, c'est le cas, même si JavaScript vous permet de placer des chaînes dans l'un ou l'autre type de citation. Si vous souhaitez utiliser des guillemets dans les chaînes JSON, utilisez \ " au lieu.
Un tableau est une collection d'éléments où chacun est affecté à un entier spécifique. Un objet est une collection d’articles où chacun est affecté à un objet spécifique. chaîne. Les articles sont appelés valeurs, et les chaînes utilisées pour les identifier sont appelées clés. Certains langages de programmation appellent ce type de structure de données un table de hachage ou hash map.
Nous pourrions représenter les âges des personnes dans un objet comme celui-ci:
"Alan": 44 ans, "John": 58 ans, "Brian": 19 ans, "Eliza": 4 ans, "Jessie": 58 ans. "
Les accolades indiquent "ceci est un objet" et, comme pour les tableaux, des virgules séparent les différents éléments. Cependant, les éléments sont donnés en paires, cette fois. Il est plus facile de voir si nous ajoutons des nouvelles lignes et des indentations:
"Alan": 44 ans, "John": 58 ans, "Brian": 19 ans, "Eliza": 4 ans, "Jessie": 58 ans. "
Dans chaque paire, deux points séparent la clé (qui est une chaîne) de la valeur (qui, dans ce cas, est un nombre). Quand nous faisions un tableau, nous n’avions pas besoin de spécifier le nombre entier auquel chaque élément était assigné (c’est-à-dire que nous devions seulement spécifier les valeurs et non les clés), car ils étaient assignés selon l’ordre dans lequel ils étaient écrits. le tableau.
Plutôt que de demander le deuxième ou le cinquième élément, comme vous le feriez lors de l'accès à un tableau, avec un objet, vous demanderez l'élément "Alan" ou "Eliza"..
Pour rendre les choses plus confuses, les objets vous permettent également d’utiliser des chaînes comme valeurs - pas seulement des clés. Donc, vous pourriez avoir un objet comme celui-ci:
"Activetuts +": "http://active.tutsplus.com/", "Psdtuts +": "http://psd.tutsplus.com/", "Nettuts +": "http://net.tutsplus.com/" "," Aetuts + ":" http://ae.tutsplus.com/ "," Vectortuts + ":" http://vector.tutsplus.com/ "," Audiotuts + ":" http://audio.tutsplus.com / "," Cgtuts + ":" http://cg.tutsplus.com/ "," Phototuts + ":" http://photo.tutsplus.com/ "," Webdesigntuts + ":" http: //webdesign.tutsplus. com / "," Mobiletuts + ":" http://mobile.tutsplus.com/ "
Ainsi, pour récupérer l'URL d'un site Tuts + donné, vous pouvez le demander en utilisant le nom du site comme clé. Cependant, l'inverse n'est pas vrai - vous ne pouvez pas utiliser "http://cg.tutsplus.com/" pour récupérer "Cgtuts +".
Les mêmes règles concernant différents types de guillemets s’appliquent aux objets comme aux tableaux. Les objets peuvent également utiliser des chaînes, des nombres, vrai, faux, et nul comme valeurs (mais seulement des chaînes comme clés).
Les objets et les tableaux peuvent également stocker d'autres objets et tableaux. Cela nous permet de créer des structures de données imbriquées. par exemple:
"Activetuts +": "url": "http://active.tutsplus.com/", "hasPremium": true, "Psdtuts +": "url": "http://psd.tutsplus.com/ "," hasPremium ": true," Nettuts + ": " url ":" http://net.tutsplus.com/ "," hasPremium ": true," Aetuts + ": " url ":" http: //ae.tutsplus.com/ "," hasPremium ": true," Vectortuts + ": " url ":" http://vector.tutsplus.com/ "," hasPremium ": true," Audiotuts + ": "url": "http://audio.tutsplus.com/", "hasPremium": true, "Cgtuts +": "url": "http://cg.tutsplus.com/", "hasPremium" : true, "Phototuts +": "url": "http://photo.tutsplus.com/", "hasPremium": true, "Webdesigntuts +": "url": "http: //webdesign.tutsplus .com / "," hasPremium ": false," Mobiletuts + ": " url ":" http://mobile.tutsplus.com/ "," hasPremium ": false
Voyons cela avec un peu plus d'espace:
"Activetuts +": "url": "http://active.tutsplus.com/", "hasPremium": true, "Psdtuts +": "url": "http://psd.tutsplus.com/ "," hasPremium ": true," Nettuts + ": " url ":" http://net.tutsplus.com/ "," hasPremium ": true," Aetuts + ": " url ":" http: //ae.tutsplus.com/ "," hasPremium ": true," Vectortuts + ": " url ":" http://vector.tutsplus.com/ "," hasPremium ": true," Audiotuts + ": "url": "http://audio.tutsplus.com/", "hasPremium": true, "Cgtuts +": "url": "http://cg.tutsplus.com/", "hasPremium" : true, "Phototuts +": "url": "http://photo.tutsplus.com/", "hasPremium": true, "Webdesigntuts +": "url": "http: //webdesign.tutsplus .com / "," hasPremium ": false," Mobiletuts + ": " url ":" http://mobile.tutsplus.com/ "," hasPremium ": false
Chaque objet contient deux champs: un avec la clé "url" dont la valeur est une chaîne contenant l'URL du site et l'autre avec la clé aPremium dont la valeur est un booléen c'est vrai si le site a une section Premium.
Nous ne sommes toutefois pas limités à avoir exactement la même structure pour chaque objet du JSON. Par exemple, nous pourrions ajouter une URL supplémentaire qui pointe vers l'URL du programme Premium, mais uniquement pour les sites qui en ont une:
"Activetuts +": "url": "http://active.tutsplus.com/", "hasPremium": true, "premiumUrl": "http://tutsplus.com/Premium-program/active-Premium/ "," Psdtuts + ": " url ":" http://psd.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http://tutsplus.com/Premium-program/psd- Premium / "," Nettuts + ": " url ":" http://net.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http://tutsplus.com/Premium-program/ net-Premium / "," Aetuts + ": " url ":" http://ae.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http://tutsplus.com/Premium- programme / ae-Premium / "," Vectortuts + ": " url ":" http://vector.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http://tutsplus.com// Premium-programme / vector-Premium / "," Audiotuts + ": " url ":" http://audio.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http: // tutsplus. com / Premium-programme / audio-Premium / "," Cgtuts + ": " url ":" http://cg.tutsplus.com/ "," hasPremium ": true," premiumUrl ":" http: // tutsplus.com/Premium-program/cg-Premium/ "," Phototuts + ": " url " : "http://photo.tutsplus.com/", "hasPremium": true, "premiumUrl": "http://tutsplus.com/Premium-program/photo-Premium/", "Webdesigntuts +": " url ":" http://webdesign.tutsplus.com/ "," hasPremium ": false," Mobiletuts + ": " url ":" http://mobile.tutsplus.com/ "," hasPremium ": false
Nous pourrions même inclure un tableau de tous les derniers tutoriels Premium pour un site donné (je montrerai simplement Activetuts + ici, et le limiterai à quelques primes, pour économiser de l'espace):
"Activetuts +": "url": "http://active.tutsplus.com/", "hasPremium": true, "premiumUrl": "http://tutsplus.com/Premium-program/active-Premium/ "" previousPremiums ": [" http://tutsplus.com/join/ "," http://active.tutsplus.com/tutorials/games/create-a-space-shooter-game-in-flash-using- as3http: //tutsplus.com/join/ "," http://active.tutsplus.com/tutorials/games/obscuring-and-revealing-scenes-with-as3http://tutsplus.com/join/ "," http://active.tutsplus.com/tutorials/games/building-a-dynamic-shadow-casting-engine-in-as3http://tutsplus.com/join/ "," http://tutsplus.com/join / "], / ** SNIP! ** / "Mobiletuts +": "url": "http://mobile.tutsplus.com/", "hasPremium": false
Un tableau est logique pour répertorier les primes, car je pars du principe que toute application qui lit ces données va simplement afficher une liste de didacticiels Premium, plutôt que de devoir y accéder en fonction de leur nom. pas besoin de leur attribuer une clé de chaîne.
Nous pourrions aller encore plus loin:
"Activetuts +": "url": "http://active.tutsplus.com/", "premium": "hasPremium": true, "premiumUrl": "http://tutsplus.com/Premium-program / active-Premium / "," previousPremiums ": [" title ":" Créer une application de questionnaire Flash personnalisable "," url ":" http://tutsplus.com/join/ ",, " title ": "Créer un jeu Space Shooter en Flash avec AS3", "url": "http://active.tutsplus.com/tutorials/games/create-a-space-shooter-game-in-flash-using-as3http:/ /tutsplus.com/join/ ",, " title ":" Obscuriner et révéler des scènes avec AS3 "," url ":" http://active.tutsplus.com/tutorials/games/obscuring-and-reveal- scènes-with-as3http: //tutsplus.com/join/ ",, " title ":" Construction d'un moteur de diffusion d'ombres dynamique en AS3 "," url ":" http://active.tutsplus.com/tutorials /games/building-a-dynamic-shadow-casting-engine-in-as3http://tutsplus.com/join/ ",, " title ":" Animation du podcast de la communauté Envato "," url ":" http : //tutsplus.com/join/ "], / ** SNIP! ** / "Mobiletuts +": "url": "http://mobile.tutsplus.com/", "premium": "hasPremium": false
Phew! Si nous le voulions, nous pourrions créer des objets contenant les noms et les URL de profil de chaque auteur de chaque tutoriel Premium - pouvez-vous trouver le meilleur moyen de le faire??
Garder les tableaux dans les tableaux peut aussi être utile; en particulier pour les jeux. Cela pourrait être la disposition actuelle d'un tableau de Tic-Tac-Toe:
[[1, 2, 0], [0, 1, 0] [0, 2, 1]]
Ne pas le voir? Essayez de supprimer des espaces:
[[1,2,0], [0,1,0], [0,2,1]]
1 est un rien, 2 est une croix et 0 est un espace vide. La morve gagne! Et je suis sûr que vous pouvez voir comment quelque chose de similaire pourrait être utilisé pour Battleships, Connect 4 ou Minesweeper. Pour plus d'informations sur les tableaux imbriqués, consultez mon précédent tutoriel.
Depuis que JSON est si populaire, il y a analyseurs (outils et bibliothèques qui décodent un langage de programmation pour qu’un autre puisse le comprendre) et générateurs (outils et bibliothèques qui font le contraire; encodez un langage de programmation dans un autre) disponible pour la plupart des langages de programmation. Il suffit de chercher [Analyseur JSON (nom de votre langue]. Je vais en souligner quelques-unes qui sont pertinentes pour les lecteurs Activetuts +.
As3corelib est la bibliothèque standard pour le codage et le décodage de données JSON dans AS3. voir mon guide d'utilisation de bibliothèques externes si vous ne savez pas comment l'installer.
Vous pouvez décoder une chaîne au format JSON en objets et en tableaux AS3 en la transmettant à com.adobe.serialization.json.JSON.decode (); la valeur de retour sera soit un tableau, soit un objet, en fonction du JSON. Si vous passez faux comme second argument, le décodeur ne suivra pas la norme JSON de manière aussi stricte, vous pourrez donc vous en sortir avec un formatage plus bâclé.
Vous pouvez coder un objet ou un tableau AS3 (qui peut contenir des objets et des tableaux imbriqués) en chaîne JSON en le transmettant à com.adobe.serialization.json.JSON.encode (); la valeur de retour sera une chaîne.
Il a été annoncé que les futures versions de Flash incluront l'analyse JSON native. Il n'y aura donc bientôt plus besoin d'utiliser as3corelib à cette fin..
Pour analyser JSON, ajoutez simplement une référence à System.Json. Ensuite:
#using System.Json; decoded = JsonValue.Parse (jsonString); // peut être un JsonPrimitive, JsonArray ou JsonObject, selon le JSON transmis
Encoder un objet sur une chaîne JSON est un peu plus compliqué. Vous devez d'abord créer un contrat de données pour le type d'objet que vous souhaitez encoder. appelons les nôtres Chose, et l'objet réel ma chose. Ensuite:
# en utilisant System.Runtime.Serialization.Json; MemoryStream myStream = new MemoryStream (); DataContractJsonSerializer jsonEncoder = new DataContractJsonSerializer (typeof (Thing)); jsonEncoder.WriteObject (myStream, myThing); myStream.Position = 0; StreamReader sr = nouveau StreamReader (myStream); codé = sr.ReadToEnd ();
Vous pouvez également utiliser cette méthode pour décoder une chaîne JSON en une classe d'objet spécifique:
# en utilisant System.Runtime.Serialization.Json; myStream.Position = 0; myOtherThing = ser.ReadObject (myStream); // vous devriez jeter ceci comme chose
Pour plus d'informations, voir les pages MSDN Utilisation des données JSON et Procédure: sérialiser et désérialiser des données JSON.
Vous pourrait il suffit de passer la chaîne JSON à eval () en JavaScript, mais c'est un risque de sécurité terrible. La plupart des navigateurs modernes supportent une fonction JSON.parse (), qui analysera une chaîne JSON en objets JavaScript, et JSON.stringify (), qui transformera un objet ou un tableau JavaScript en une chaîne JSON.
Douglas Crockford a créé une bibliothèque pour le faire dans les navigateurs plus anciens; il est disponible sur github.
Il existe un assemblage C # appelé LitJSON que vous pouvez utiliser dans vos projets Unity pour analyser et générer du JSON. Vous pouvez l'utiliser même si votre projet est écrit en JavaScript ou en boo plutôt qu'en C #.
Pour décoder un objet Unity en une chaîne JSON:
# utilisant LitJson; string jsonString = JsonMapper.ToJson (myObject);
Pour coder une chaîne JSON en un objet Unity de type Thing:
# utilisant LitJson; Chose myThing = JsonMapper.ToObject(jsonString);
Le manuel LitJSON est génial; Je recommande de lire cela pour plus de conseils.
JSON.org a une longue liste de bibliothèques pour différentes plates-formes et langues - vous pouvez également rechercher sur Google, comme mentionné ci-dessus;)
Ce site propose également de superbes visualisations de la manière dont JSON peut être construit, ainsi que de nombreux détails allant au-delà de ce que j'ai expliqué dans cette brève introduction. Allez voir si vous voulez en savoir plus!
Accentsconagua