JSON Comment convertir un texte JSON à un objet JavaScript

convertir un texte JSON à un objet JavaScript


COURS tutoriel JSON

Une utilisation la plus courante de JSON est d'extraire les données JSON d'un serveur web (comme un fichier ou comme un HttpRequest), convertir les données JSON à un objet JavaScript, et utilise ensuite les données dans une page web.

Pour plus de simplicité, il peut être démontré en utilisant une chaîne en entrée (au lieu d'un fichier).

Exemple JSON - objet chaîne

Créer une chaîne de JavaScript contenant la syntaxe JSON :

var txt = '{ "employées" : [' +
'{ "prenom":"Jenifère" , "Nom":"Du bois" },' +
'{ "prenom":"Amal" , "Nom":"Sami" },' +
'{ "prenom":"Piére" , "Nom":"Jolie" } ]}';

Puisque la syntaxe JSON est un sous-ensemble de la syntaxe JavaScript, la fonction eval() de JavaScript peut être utilisé pour convertir un texte JSON en un objet JavaScript.

La fonction eval() utilise le compilateur JavaScript qui va analyser le texte JSON et produire un objet JavaScript. Le texte doit être enveloppé dans la parenthèse pour éviter une erreur de syntaxe :

var obj = eval ("(" + txt + ")");

Exemple Utilisez l'objet JavaScript dans votre page :

Sélectionner le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Creation d'objet dans javascript en
  utilisant une chaine JSON</title>
  </head>
  <body>
  <h2>Creater un Objet à partir d'une une chaine
  JSON</h2>
  <p>
  Prénom: <span id="pnom"></span><br>
  Nom: <span id="nom"></span><br>
  </p>
  <script>
  var txt = '{"employées":[' +
  '{"prenom":"Jenifère","Nom":"Du bois"},' +
  '{"prenom":"Amal","Nom":"Sami"},' +
  '{"prenom":"Piére","Nom":"Jolie"}]}';
   
  var obj = eval ("(" + txt + ")");
   
  document.getElementById("pnom").innerHTML=obj.employées[1].prenom
  document.getElementById("nom").innerHTML=obj.employées[1].Nom
  </script>
   
  </body>
  </html>

 

ANALYSEUR JSON

lampLa fonction eval() peut compiler et exécuter n'importe quel JavaScript. Mai si il s'agit d'un problème de sécurité potentiel.

Il est plus sûr d'utiliser un analyseur JSON pour convertir un texte JSON à un objet JavaScript.

Un analyseur JSON reconnaîtra uniquement le texte JSON et ne compile pas les scripts.

Dans les navigateurs qui fournissent JSON natif. les analyseurs JSON sont également plus rapides.

Prise en charge native de JSON est inclus dans les navigateurs récents et dans la nouvelle norme ECMAScript (JavaScript).

Support Navigateur Web   Support logiciel
Firefox (Mozilla) 3.5

Internet Explorer 8

Chrome

Opera 10

Safari 4

jQuery

Yahoo UI

Prototype

Dojo

ECMAScript 1.5

Exemple Créer un Objet à partir d'une une chaine JSON

Sélectionner le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Creation d'objet dans javascript en
  utilisant une chaine JSON</title>
  </head>
  <body>
  <h2>Créer un Objet à partir d'une une chaine
  JSON</h2>
  <br>
  <script>
  var txt = '{"employées":[' +
  '{"prenom":"Jenifère","Nom":"Du bois"},' +
  '{"prenom":"Amal","Nom":"Sami"},' +
  '{"prenom":"Piére","Nom":"Jolie"}]}';
   
  var obj = eval ("(" + txt + ")");
  for(i=0;i<obj.employées.length;i++){
  document.writeln("Prénom : "+obj.employées[i].prenom+" " );
  document.writeln(" Nom :
  "+obj.employées[i].Nom+"<br><br>"); }
  </script>
  </body>
  </html>

 

Pour les navigateurs plus anciens, une bibliothèque JavaScript est disponible à https://github.com/douglascrockford/JSON-js

Le format JSON est spécifiée à l'origine par Douglas Crockford

Par carabde 2 novembre 2014