Parse JSON en JavaScript? [dupliquer]

cette question a déjà une réponse ici:

je veux analyser une chaîne JSON en JavaScript. La réponse est quelque chose comme

var response = '{"result":true,"count":1}';

Comment puis-je obtenir les valeurs result et count de ça?

1534
demandé sur Taryn 2011-02-08 19:34:03

16 réponses

la plupart des navigateurs prennent en charge JSON.parse() , qui est défini dans ECMA-262 5e édition (la spécification sur laquelle JavaScript est basé). Son usage est simple:

var json = '{"result":true,"count":1}',
    obj = JSON.parse(json);

alert(obj.count);

/* or ES6 */

const json = '{"result":true,"count":1}' || {};
const { result, count } = JSON.parse(json);
alert(result);
alert(count);

pour les navigateurs que vous ne pouvez pas mettre en œuvre en utilisant json2.js .

comme indiqué dans les commentaires, si vous utilisez déjà jQuery, il ya une fonction $.parseJSON qui correspond à JSON.parse si disponible ou une forme de eval dans les navigateurs plus anciens. Cependant, cela permet d'effectuer des contrôles supplémentaires inutiles qui sont également effectués par JSON.parse , donc pour la meilleure performance de tous, je recommande de l'utiliser comme ceci:

var json = '{"result":true,"count":1}',
    obj = JSON && JSON.parse(json) || $.parseJSON(json);

cela vous assurera d'utiliser JSON.parse immédiatement, plutôt que de demander à jQuery d'effectuer des contrôles de bon sens sur la chaîne avant de la passer à la fonction de parsing natif.

1875
répondu Andy E 2018-09-12 10:13:09

tout d'Abord, vous devez vous assurer que le code JSON est valide.

après cela, je recommande d'utiliser une bibliothèque JavaScript telle que jQuery ou Prototype si vous le pouvez parce que ces choses sont bien gérées dans ces bibliothèques.

d'un autre côté, si vous ne voulez pas utiliser une bibliothèque et que vous pouvez vous porter garant de la validité de l'objet JSON, je voudrais simplement envelopper la chaîne dans une fonction anonyme et utiliser la fonction eval.

ceci n'est pas recommandé si vous obtenez L'objet JSON d'une autre source qui n'est pas absolument fiable parce que la fonction eval permet le code renegade si vous le voulez.

Voici un exemple d'utilisation de la fonction eval:

var strJSON = '{"result":true,"count":1}';
var objJSON = eval("(function(){return " + strJSON + ";})()");
alert(objJSON.result);
alert(objJSON.count);

si vous contrôlez quel navigateur est utilisé ou si vous n'êtes pas inquiet les gens avec un vieux navigateur, vous pouvez toujours utiliser le JSON.méthode d'analyse.

C'est vraiment l'idéal solution pour l'avenir.

90
répondu Clarence Fredericks 2017-02-28 11:17:39

si vous obtenez ce à partir d'un site extérieur, il pourrait être utile d'utiliser getJSON de jQuery. Si c'est une liste que vous pouvez parcourir avec $.chaque

$.getJSON(url, function (json) {
    alert(json.result);
    $.each(json.list, function (i, fb) {
        alert(fb.result);
    });
});
49
répondu milestyle 2018-03-30 21:30:42

si vous voulez utiliser JSON 3 pour les navigateurs plus anciens, vous pouvez le charger conditionnellement avec:

<script>
    window.JSON || 
    document.write('<script src="//cdnjs.cloudflare.com/ajax/libs/json3/3.2.4/json3.min.js"><\/scr'+'ipt>');
</script>

maintenant l'objet standard window.JSON est disponible pour vous, quel que soit le navigateur utilisé par un client.

32
répondu huwiler 2018-03-30 21:30:57

l'exemple suivant le rendra clair:

var jsontext   = '{"name":"x","age":"11"}';
var getContact = JSON.parse(jsontext);
document.write(getContact.name + ", " + getContact.age);

// Output: x, 11

ou

vous pouvez également utiliser la fonction eval . L'exemple suivant utilise la fonction eval :

var jsontext   = '{"name":"x","age":"11"}';
var getContact = eval('(' + jsontext + ')');
document.write(getContact.name + ", " + getContact.age);

// Output: x, 11

étant donné que la fonction JSON.parse est plus sûre et s'exécute plus rapidement que la fonction eval, je vous recommande d'utiliser la fonction JSON.parse .

31
répondu Joke_Sense10 2014-06-06 14:00:53

Vous pouvez soit utiliser la fonction eval comme dans certains autres réponses. (N'oubliez pas les bretelles supplémentaires.) Vous saurez pourquoi lorsque vous creusez plus profond), ou tout simplement utiliser la fonction jQuery parseJSON :

var response = '{"result":true , "count":1}'; 
var parsedJSON = $.parseJSON(response);

ou

Vous pouvez utiliser ce code ci-dessous.

var response = '{"result":true , "count":1}';
var jsonObject = JSON.parse(response);

et vous pouvez accéder aux champs en utilisant jsonObject.result et jsonObject.count .

25
répondu Teja 2014-06-06 13:59:43

si vous passez une variable string (une chaîne JSON bien formée) à JSON.analyser à partir de MVC @Viewbag qui a apostrophe, '"', comme les guillemets, vous avez besoin de la traiter avant de JSON.parse ( jsonstring )

    var jsonstring = '@ViewBag.jsonstring';
    jsonstring = jsonstring.replace(/&quot;/g, '"');  
25
répondu Jenna Leaf 2017-05-25 21:12:57

la méthode la plus facile en utilisant parse() :

var response = '{"a":true,"b":1}';
var JsonObject= JSON.parse(response);

ceci est un exemple de la façon d'obtenir des valeurs:

var myResponseResult = JsonObject.a;
var myResponseCount = JsonObject.b;
23
répondu Jorgesys 2016-02-20 00:58:42

sans utiliser une bibliothèque, vous pouvez utiliser eval - la seule fois que vous devriez utiliser. Il est plus sûr d'utiliser une bibliothèque.

par exemple...

var response = '{"result":true , "count":1}';

var parsedJSON = eval('('+response+')');

var result=parsedJSON.result;
var count=parsedJSON.count;

alert('result:'+result+' count:'+count);
19
répondu El Ronnoco 2011-02-08 16:45:37

JSON.parse () convertit n'importe quelle chaîne JSON passée dans la fonction, en un objet JSON.

pour une meilleure compréhension, appuyez sur F12 pour ouvrir L'élément inspection de votre navigateur, et allez à la console pour écrire les commandes suivantes:

var response = '{"result":true,"count":1}'; // Sample JSON object (string form)
JSON.parse(response); // Converts passed string to a JSON object.

exécutez maintenant la commande:

console.log(JSON.parse(response));

vous obtiendrez la sortie comme objet {result: true, count: 1}.

afin d'utiliser ce objet, vous pouvez l'attribuer à la variable, disons obj :

var obj = JSON.parse(response);

maintenant en utilisant obj et le point(. opérateur vous pouvez accéder aux propriétés de l'Objet JSON.

essayer d'exécuter la commande

console.log(obj.result);
19
répondu Pushkar Kathuria 2017-05-25 21:11:55

si vous aimez

var response = '{"result":true,"count":1}';
var JsonObject= JSON.parse(response);

vous pouvez accéder aux éléments JSON par JsonObject avec (.) dot:

JsonObject.result;
JsonObject.count;
17
répondu user5676965418 2017-05-25 21:10:07

je pensais que JSON.parse(myObject) marcherait. Mais selon les navigateurs, il pourrait être utile d'utiliser eval('('+myObject+')') . Le seul problème que je peux recommander de surveiller est la liste à plusieurs niveaux dans JSON.

11
répondu ha9u63ar 2013-04-04 10:38:37

une façon facile de le faire:

var data = '{"result":true,"count":1}';
var json = eval("[" +data+ "]")[0]; // ;)
9
répondu yassine 2017-05-25 21:13:11

si vous utilisez jQuery, il est simple:

var response = '{"result":true,"count":1}';
var obj = $.parseJSON(response);
alert(obj.result); //true
alert(obj.count); //1
4
répondu legendJSLC 2014-06-06 14:01:18

si vous utilisez Dojo Toolkit :

require(["dojo/json"], function(JSON){
    JSON.parse('{"hello":"world"}', true);
});
4
répondu Brendon-Van-Heyzen 2017-05-25 21:13:49

comme mentionné par de nombreux autres, la plupart des navigateurs prennent en charge JSON.parse et JSON.stringify .

maintenant, je voudrais aussi ajouter que si vous utilisez AngularJS (que je recommande fortement), alors il fournit également la fonctionnalité que vous avez besoin:

var myJson = '{"result": true, "count": 1}';
var obj = angular.fromJson(myJson);//equivalent to JSON.parse(myJson)
var backToJson = angular.toJson(obj);//equivalent to JSON.stringify(obj)

je voulais juste ajouter le truc sur AngularJS pour fournir une autre option. Notez Qu'AngularJS ne supporte pas officiellement Internet Explorer 8 (et plus ancien versions, d'ailleurs), mais à travers l'expérience de la plupart des choses semble fonctionner assez bien.

4
répondu user2359695 2017-05-25 21:14:40