7.2. Les différences entre JavaScript et JSON

On doit maintenant examiner les différences entre JavaScript et le format JSON. Car même si leur syntaxe respective sont proches, il ne faut pas les confondre.

Même si je suis bien d’accord avec vous, ce n’est vraiment pas nous aider que d’avoir mis le terme JavaScript à l’intérieur même de JSON ! 🤯

Alors, au départ, JSON a été créé indépendamment de la spécification ECMAScript et du monde JavaScript. D’ailleurs, quasiment tous les langages peuvent interagir avec le JSON : Python, PHP, Java, etc. Le JSON n’est donc pas restreint au monde JavaScript, et n’a d’ailleurs rien à voir avec JavaScript en soi. Par contre il est « légèrement » inspiré de la façon dont les objets JavaScript sont écrits.

Mais depuis quelque temps, le JavaScript et le JSON deviennent de plus en plus liés. Où plutôt, le JavaScript intègre de plus en plus JSON. D’ailleurs, il existe carrément un objet JSON dans JavaScript maintenant, regardez plutôt dans votre navigateur :

Apparemment, il existe même un objet JSON dans JavaScript.

Bon, ça c’était pour la petite histoire, et pour y voir plus clair aussi.

Mais ce qui nous intéresse nous en tant que développeur, ce sont les différences techniques entre JavaScript et JSON. En termes de syntaxe, il y a trois différences principales.

Différence 1/3 : Les clefs sont des chaînes de caractères

Tout d’abord en JSON, les clefs doivent TOUTES être représentés sous forme de chaînes de caractères, autrement dit avec des guillemets. Ceci par exemple n’est pas du JSON valide :

// Javascript valide ? OK
// JSON valide ? KO
{
  name: "Bulbizzare"
}

La façon correcte d’écrire ce JSON est :

// JavaScript valide ? : OK
// JSON valide ? : KO
{
  "name": "Bulbizzare"
}

Différence 2/3 : Les guillemets simples sont interdites

Avec JSON, non seulement les clefs doivent être des chaînes de caractère, mais il faut nécessairement utiliser des guillemets doubles, que ce soit pour les clefs ou les valeurs :

// Javascript valide : OK
// JSON valide ? : KO
{
  'name': 'Bulbizzare'
}

À la place, voici la bonne façon de faire :

// Javascript valide ? OK
// JSON valide ? OK
{
  "name": "Bulbizzare"
}

C’est une règle complètement arbitraire, mais elle est essentielle et a tendance à être oubliée…

Différence 3/3 : Les valeurs possibles sont restreintes

Une autre différence majeure entre JavaScript et le JSON, ce sont les types de données que l’on peut utiliser. JSON accepte seulement les valeurs suivantes, comme nous l’avons vu dans l’étape précédente : ObjectArrayNumberStringtruefalse et null.

C’est assez similaire à ce que l’on peut trouver dans des objets JavaScript. Mais nous devons nous rappeler que fondamentalement, JSON est un format de données textuelle, et non un langage comme JavaScript !

Donc il est impossible de définir des fonctions, ou des valeurs dynamique comme new Date() par exemple :

// Javascript valide ? OK
// JSON valide ? KO
{
  "name": "Bulbizzare",
  "created": new Date()
}

Vous ne pouvez utiliser que du texte statique en JSON :

// Javascript valide ? OK
// JSON valide ? OK
{
  "name": "Bulbizzare",
  "created": "01/01/2021"
}

Voilà, c’est tout, il faut le savoir.

L’avantage, c’est que ces quelques règles que nous venons de voir font du JSON un format universel d’échange de données, entre plusieurs programmes informatiques différents.

Dans la prochaine étape, nous verrons comment mettre en pratique tout ce que nous venons de voir, car on ne fait que parler beaucoup depuis le début, on veut du concret !