web-dev-qa-db-fra.com

Chaîne JSON en objet JS

J'utilise un objet JS pour créer des graphiques avec la visualisation Google. J'essaie de concevoir la source de données. Au début, j'ai créé un objet JS côté client.

var JSONObject = {
    cols: [{id: 'date', label: 'Date', type: 'date'},
{id: 'soldpencils', label: 'Sold Pencils', type: 'number'},
        {id: 'soldpens', label: 'Sold Pens', type: 'number'}],
    rows: [{c:[{v: new Date(2008,1,1),f:'2/1/2008'},{v: 30000}, {v: 40645}]},
        {c:[{v: new Date(2008,1,2),f:'2/2/2008'},{v: 14045}, {v: 20374}]},
     {c:[{v: new Date(2008,1,3),f:'2/3/2008'},{v: 55022}, {v: 50766}]}]  
};

var data = new google.visualization.DataTable(JSONObject, 0.5);

Maintenant, je dois récupérer les données de manière dynamique. J'envoie donc une demande AJAX à une page qui renvoie la chaîne JSON:

 "cols: [{id: 'date', label: 'Date', type: 'date'},
{id: 'soldpencils', label: 'Sold Pencils', type: 'number'},
{id: 'soldpens', label: 'Sold Pens', type: 'number'}],
  rows: [{c:[{v: new Date(2008,1,1),f:'2/1/2008'},{v: 30000}, {v: 40645}]},
      {c:[{v: new Date(2008,1,2),f:'2/2/2008'},{v: 14045}, {v: 20374}]},
{c:[{v: new Date(2008,1,3),f:'2/3/2008'},{v: 55022}, {v: 50766}]}"

J'économise cela dans une variable:

var var1 = "cols: [{i ....... 66}]}"

et montrer comme

alert(var1);

Maintenant, ma tâche est de créer un objet JS à partir de cette chaîne. Ceci ne fonctionne pas. Lorsque j'utilise un objet JS, tout fonctionne correctement et je peux obtenir le graphique requis. Maintenant, si j'essaie de mettre la même valeur de chaîne à partir de la demande AJAX que j'ai confirmée à partir d'un message d'alerte dans un objet, l'objet ne sera pas créé correctement. Merci de me faire connaître votre correction ou conseils.

javascriptjqueryjsonjsonpgetjson
70
Vinod

Certains navigateurs modernes prennent en charge l'analyse JSON dans un objet natif:

var var1 = '{"cols": [{"i" ....... 66}]}';
var result = JSON.parse(var1);

Pour les navigateurs qui ne le prennent pas en charge, vous pouvez télécharger json2.js à partir de json.org pour analyser en toute sécurité un objet JSON. Le script vérifie la prise en charge JSON native et, s’il n’existe pas, fournit l’objet global JSON à la place. Si l'objet natif le plus rapide est disponible, il se contente de quitter le script en le laissant intact. Vous devez toutefois fournir un code JSON valide, sinon une erreur sera générée - vous pouvez vérifier la validité de votre code JSON avec http://jslint.com ou http://jsonlint.com .

133
Andy E

la chaîne dans votre question n'est pas une chaîne JSON valide. De site Web json.org :

JSON est construit sur deux structures:

* A collection of name/value pairs. In various languages, this is 
  realized as an object, record, struct, dictionary, hash table, keyed list, or
  associative array.
* An ordered list of values. In most languages, this is realized as an
  array, vector, list, or sequence.

Fondamentalement, une chaîne json commencera toujours par {ou [.

Ensuite, comme @Andy E et @Cryo l'ont dit, vous pouvez analyser la chaîne avec json2.js ou d'autres bibliothèques.

IMHO, vous devriez éviter eval car ce sera un programme javascript, vous risqueriez de vous exposer à des problèmes de sécurité.

5
filippo

Vous pouvez utiliser eval (jsonString) si vous faites confiance aux données de la chaîne. Sinon, vous devrez l'analyser correctement. Vérifiez json.org pour des exemples de code.

5
whackamole

Vous pouvez utiliser cette bibliothèque depuis JSON.org pour traduire votre chaîne en objet JSON.

var var1_obj = JSON.parse(var1);

Vous pouvez également utiliser la bibliothèque jquery-json .

var var1_obj = $.toJSON(var1);
4
nortron

La chaîne que vous renvoyez n'est pas un JSON valide. Les noms dans les objets doivent être cités et la chaîne entière doit être placée dans { … } Pour former un objet. JSON ne peut pas non plus contenir quelque chose comme new Date(). JSON n'est qu'un petit sous-ensemble de JavaScript comportant uniquement des chaînes, des nombres, des objets, des tableaux, true, false et null.

Voir le grammaire JSON pour plus d'informations.

3
Gumbo