JavaScript JSON versus littéraux JavaScript


Exemple

JSON signifie "JavaScript Object Notation", mais pas JavaScript. Pensez-y comme un format de sérialisation de données qui se trouve être directement utilisable comme littéral JavaScript. Cependant, il n'est pas conseillé d'exécuter directement (c.-à-d. eval() ) JSON extrait d'une source externe. Fonctionnellement, JSON n'est pas très différent de XML ou YAML - une certaine confusion peut être évitée si JSON est simplement imaginé comme un format de sérialisation qui ressemble beaucoup à JavaScript.

Même si le nom n'implique que des objets, et même si la majorité des cas d'utilisation via une sorte d'API sont toujours des objets et des tableaux, JSON ne concerne pas uniquement les objets ou les tableaux. Les types primitifs suivants sont pris en charge:

  • Chaîne (par exemple "Hello World!" )
  • Nombre (par exemple 42 )
  • Booléen (par exemple true )
  • La valeur null

undefined n'est pas pris en charge dans le sens où une propriété non définie sera omise de JSON lors de la sérialisation. Par conséquent, il n'y a aucun moyen de désérialiser JSON et de vous retrouver avec une propriété dont la valeur n'est undefined .

La chaîne "42" est valide JSON. JSON ne doit pas toujours avoir une enveloppe externe de "{...}" ou "[...]" .

Bien que nome JSON soit également valide en JavaScript et que JavaScript soit également valide, il existe quelques différences subtiles entre les deux langages et aucun des deux ne constitue un sous-ensemble de l'autre.

Prenez la chaîne JSON suivante comme exemple:

{"color": "blue"}

Cela peut être directement inséré dans JavaScript. Il sera syntaxiquement valide et donnera la valeur correcte:

const skin = {"color": "blue"};

Cependant, nous savons que "color" est un nom d'identifiant valide et que les guillemets autour du nom de la propriété peuvent être omis:

const skin = {color: "blue"};

Nous savons également que nous pouvons utiliser des guillemets simples au lieu de guillemets doubles:

const skin = {'color': 'blue'};

Mais, si nous prenions ces deux littéraux et les traitions comme JSON, aucun JSON ne serait syntaxiquement valide :

{color: "blue"}
{'color': 'blue'}

JSON exige strictement que tous les noms de propriété soient entre guillemets et que les valeurs de chaîne soient également entre guillemets.

Il est courant que les nouveaux venus JSON tentent d'utiliser des extraits de code avec des littéraux JavaScript en tant que JSON et qu'ils se penchent sur les erreurs de syntaxe qu'ils reçoivent du parseur JSON.

Plus de confusion commence à apparaître quand une terminologie incorrecte est appliquée dans le code ou dans la conversation.

Un anti-pattern commun consiste à nommer des variables qui contiennent des valeurs non-JSON comme "json":

fetch(url).then(function (response) {
  const json = JSON.parse(response.data); // Confusion ensues!

  // We're done with the notion of "JSON" at this point,
  // but the concept stuck with the variable name.
});

Dans l'exemple ci-dessus, response.data est une chaîne JSON renvoyée par certaines API. JSON s'arrête au domaine de réponse HTTP. La variable avec le terme incorrect "json" ne contient qu'une valeur JavaScript (peut être un objet, un tableau ou même un simple numéro!)

Une façon moins confuse d'écrire ce qui précède est la suivante:

fetch(url).then(function (response) {
  const value = JSON.parse(response.data);

  // We're done with the notion of "JSON" at this point.
  // You don't talk about JSON after parsing JSON.
});

Les développeurs ont également tendance à lancer l'expression "objet JSON". Cela conduit également à la confusion. Parce que, comme mentionné ci-dessus, une chaîne JSON ne doit pas contenir un objet en tant que valeur. "Chaîne JSON" est un meilleur terme. Tout comme "Chaîne XML" ou "Chaîne YAML". Vous obtenez une chaîne, vous l’analyse et vous obtenez une valeur.