Objet Javascript Vs JSON

Je veux comprendre clairement les différences de base entre l'objet Javascript et la chaîne JSON.

Disons que je crée la variable JS suivante:

var testObject = {one: 1,"two":2,"three":3};

Q1. Le nom de clé / propriété est-il valide avec / sans guillemets? (par exemple "one" : 1)

Si oui, quelle est la différence?

Q2: Si je convertis l'objet ci-dessus à l'aide de JSON.stringify(testObject), quelle est la différence entre l'objet JS d'origine et le JSON?

Je pense qu'ils sont presque les mêmes. Veuillez développer à ce sujet.

Q3: Pour analyser une chaîne JSON, la méthode ci-dessous est-elle recommandée?

var javascriptObj = JSON.parse(jSonString);

1. Le nom de clé / propriété est-il valide avec / sans guillemets?

   Le seul moment où vous devez joindre une clé entre guillemets lorsque vous utilisez la notation littérales d'objets est où la clé contient un caractère spécial ( if, :, -etc.). Il est intéressant de noter qu'une clé JSON doit être enfermé dans doubles guillemets.

2. Si je convertis l'objet ci-dessus en JSON en utilisant var jSonString = JSON.stringify(testObject);, quelle est la différence entre les 2 (obj JS et JSON)?

   JSON est un format d'échange de données. C'est une norme qui décrit comment les listes ordonnées et les cartes non ordonnées, les chaînes booléennes et les nombres peuvent être représentés dans une chaîne. Tout comme XML et YAML est un moyen de transmettre des informations structurées entre les langues, JSON est le même. En revanche, un objet JavaScript est un type physique. Tout comme un tableau PHP, une classe / structure C ++, un objet JavaScript est un type interne à JavaScript.

   Voici une histoire. Imaginons que vous ayez acheté des meubles dans un magasin et que vous souhaitiez les faire livrer. Cependant, le seul modèle en stock est le modèle d'affichage, mais vous acceptez de l'acheter.

   Dans la boutique, la commode que vous avez achetée est un objet vivant:

   var chestOfDrawers = {
       color: "red",
       numberOfDrawers: 4
   }

   Cependant, vous ne pouvez pas envoyer de commode par la poste, vous devez donc la démonter (lire, la stringifier). C'est désormais inutile en termes de mobilier. C'est maintenant JSON. C'est sous forme de pack plat.

   {"color":"red","numberOfDrawers":4}

   Lorsque vous le recevez, vous reconstruisez ensuite la commode (lisez-la, analysez-la). Il est maintenant de retour sous forme d'objet.

   La raison derrière JSON / XML et YAML est de permettre le transfert de données entre les langages de programmation dans un format que les deux langages participants peuvent comprendre; vous ne pouvez pas donner directement à PHP ou C ++ votre objet JavaScript; parce que chaque langue représente un objet différemment sous le capot. Cependant, parce que nous avons stratifié l'objet en notation JSON; c'est-à-dire une manière standardisée de représenter les données, nous pouvons transmettre la représentation JSON de l'objet à une autre langue (C ++, PHP), ils peuvent recréer l'objet JavaScript que nous avions dans leur propre objet basé sur la représentation JSON de l'objet.

   Il est important de noter que JSON ne peut pas représenter des fonctions ou des dates. Si vous essayez de stringifier un objet avec un membre de fonction, la fonction sera omise de la représentation JSON. Une date sera convertie en chaîne;

   JSON.stringify({
       foo: new Date(),
       blah: function () { 
           alert('hello');
       }
   }); // returns the string "{"foo":"2011-11-28T10:21:33.939Z"}"

3. Pour analyser une chaîne JSON, la méthode ci-dessous est-elle recommandée? var javascriptObj = JSON.parse(jSonString);

   Oui, mais les anciens navigateurs ne prennent pas en charge JSON nativement (IE <8) . Pour les soutenir, vous devez inclure json2.js.

   Si vous utilisez jQuery, vous pouvez appeler jQuery.parseJSON(), qui utilisera JSON.parse()sous le capot s'il est pris en charge et reviendra autrement à une implémentation personnalisée pour analyser l'entrée.

Q1: Lors de la définition des littéraux d'objet en javascript, les clés peuvent inclure des guillemets ou non. Il n'y a pas de différence, sauf que les guillemets vous permettent de spécifier certaines clés qui entraîneraient l'échec de l'interpréteur si vous les essayiez nues. Par exemple, si vous vouliez une clé qui n'était qu'un point d'exclamation, vous auriez besoin de guillemets:

a = { "!": 1234 } // Valid
a = { !: 1234 } //  Syntax error

Dans la plupart des cas cependant, vous pouvez omettre les guillemets autour des clés sur les littéraux d'objet.

Q2: JSON est littéralement une représentation sous forme de chaîne. Ce n'est qu'une chaîne. Alors, considérez ceci:

var testObject = { hello: "world" }
var jSonString = JSON.stringify(testObject);

Puisqu'il testObjects'agit d'un véritable objet, vous pouvez appeler des propriétés dessus et faire tout ce que vous pouvez faire avec des objets:

testObject.hello => "world"

D'un autre côté, jsonStringc'est juste une chaîne:

jsonString.hello => undefined

Notez une autre différence: en JSON, toutes les clés doivent être entre guillemets. Cela contraste avec les littéraux d'objets, où les guillemets peuvent généralement être omis selon mon explication au premier trimestre.

Q3. Vous pouvez analyser une chaîne JSON en utilisant JSON.parse, et c'est généralement la meilleure façon de le faire (si le navigateur ou un framework le fournit). Vous pouvez également simplement l'utiliser evalcar JSON est un code javascript valide, mais l'ancienne méthode est recommandée pour un certain nombre de raisons (eval a beaucoup de problèmes désagréables associés).

Problèmes résolus par JSON

Supposons que vous souhaitiez échanger des objets JavaScript normaux entre deux ordinateurs et que vous définissiez deux règles:

• Les données transmises doivent être une chaîne régulière.
• Seuls les attributs peuvent être échangés, les méthodes ne sont pas transmises.

Vous créez maintenant deux objets sur le premier hôte:

var obj1 = { one: 1,"two":2,"three":3 }; // your example
var obj2 = { one: obj1.one, two: 2, three: obj1.one + obj1.two };

Comment pouvez-vous convertir ces objets en chaînes pour les transmettre au deuxième hôte?

• Pour le premier objet, vous pouvez envoyer cette chaîne obtenue à partir de la définition littérale '{ one: 1,"two":2,"three":3 }', mais en réalité vous ne pouvez pas lire le littéral dans la partie script du document (du moins pas facilement). Donc, obj1et obj2doit en fait être traité de la même manière.
• Vous devez énumérer tous les attributs et leur valeur et créer une chaîne similaire au littéral de l'objet.

JSON a été créé comme une solution aux besoins qui viennent d'être discutés: c'est un ensemble de règles pour créer une chaîne équivalente à un objet en listant tous les attributs et valeurs (les méthodes sont ignorées).

JSON normalise l'utilisation de guillemets doubles pour les noms et les valeurs d'attribut.

N'oubliez pas que JSON est un ensemble de règles uniquement (une norme).

Combien d'objets JSON sont créés?

Un seul, il est automatiquement créé par le moteur JS.

Les moteurs JavaScript modernes trouvés dans les navigateurs ont un objet natif, également appelé JSON. Cet objet JSON est capable de:

• Décodez une chaîne construite en utilisant la norme JSON, en utilisant JSON.parse (chaîne). Le résultat est un objet JS standard avec des attributs et des valeurs trouvés dans la chaîne JSON.

• Encode les attributs / valeurs d'un objet JS standard à l'aide de JSON.stringify (). Le résultat est une chaîne conforme à l'ensemble de règles JSON.

L'objet JSON (unique) est similaire à un codec, sa fonction est d'encoder et de décoder.

Notez que:

• JSON.parse () ne crée pas d'objet JSON, il crée un objet JS standard, il n'y a pas de différence entre un objet créé à l'aide d'un littéral d'objet et un objet créé par JSON.parse () à partir d'une chaîne compatible JSON.

• Il n'y a qu'un seul objet JSON, qui est utilisé pour toutes les conversions.

Revenons aux questions :

• Q1: L'utilisation de guillemets simples ou doubles est autorisée pour les littéraux d'objet. Notez que les guillemets sont utilisés facultativement pour les noms d'attributs et sont obligatoires pour les valeurs de chaîne. Le littéral objet lui-même n'est pas entouré de guillemets.

• Q2: Les objets créés à partir de littéraux et utilisant JSON.parse () sont strictement identiques. Ces deux objets sont équivalents après création:

  var obj1 = { one: 1, "two": 2, "three": 3 };
var obj2 = JSON.parse('{ "one": "1", "two": "2", "three": "3" }');

• Q3: Sur les navigateurs modernes, JSON.parse()est utilisé pour créer un objet JS à partir d'une chaîne compatible JSON. (jQuery a également une méthode équivalente qui peut être utilisée pour tous les navigateurs).

Q1 - dans JS, vous n'avez besoin d'utiliser des guillemets que si la clé est un mot réservé ou si ce serait autrement un jeton illégal. En JSON, vous DEVEZ toujours utiliser des guillemets doubles sur les noms de clés.

Q2 - le jsonStringest une version sérialisée de l'objet d'entrée ...

Q3 - qui peut être désérialisé en un objet identique à l'aideJSON.parse()

La question a déjà de bonnes réponses publiées, j'ajoute un petit exemple ci-dessous, ce qui facilitera la compréhension des explications données dans les réponses précédentes. Copiez-collez l'extrait ci-dessous dans votre IDE pour une meilleure compréhension et commentez la ligne contenant invalid_javascript_object_no_quotesla déclaration d'objet afin d'éviter une erreur de compilation.

// Valid JSON strings(Observe quotes)
valid_json = '{"key":"value"}'
valid_json_2 = '{"key 1":"value 1"}' // Observe the space(special character) in key - still valid


//Valid Javascript object
valid_javascript_object_no_quotes = {
    key: "value"  //No special character in key, hence it is valid without quotes for key
}


//Valid Javascript object
valid_javascript_object_quotes = {
    key:"value",  //No special character in key, hence it is valid without quotes for key
    "key 1": "value 1" // Space (special character) present in key, therefore key must be contained in double quotes  - Valid
}



console.log(typeof valid_json) // string
console.log(typeof valid_javascript_object_no_quotes) // object
console.log(typeof valid_javascript_object_quotes) // object

//Invalid Javascript object 
invalid_javascript_object_no_quotes = {
   key 1: "value"//Space (special character) present in key, since key is not enclosed with double quotes "Invalid Javascript Object"
}