Méthodes JavaScript JSON, toJSON

❮ Précédent

La JavaScript Object Notation (JSON) est un format notable pour représenter des objets et des valeurs. Initialement, ce format a été créé pour JavaScript, mais plusieurs langages incluent également des bibliothèques pour le gérer. Par conséquent, il est plus facile d'utiliser JSON pour l'échange de données dans le cas où le client utilise JavaScript, et que le serveur est écrit en PHP, Ruby, Java, et plus encore.

En général, JavaScript fournit deux méthodes de conversion : JSON.stringify et JSON.parse. Vous pouvez utiliser la première pour convertir des objets en JSON et la seconde - pour convertir le JSON en un objet.

JSON.stringify

Considérons l'exemple suivant de l'utilisation de JSON.stringify :

JSON stringify in javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
let site = {
  name: 'W3Docs',
  hasAdmin: true,
  books: ['html', 'css', 'js', 'git'],
  booksCount: 4,
};
let json = JSON.stringify(site);
console.log(typeof json); // we've got a string!
console.log(json);
/* JSON-encoded object:
{
  "name": "W3Docs",
  "hasAdmin": true,
  "books": ["html", "css", "js", "git"],  
  "booksCount": 4   
}
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Veuillez noter qu'un objet encodé en JSON diffère de l'objet littéral. Les principales différences sont les suivantes:

La chaîne utilise des guillemets doubles. Il ne doit y avoir ni guillemets simples ni backticks dans JSON. Par exemple, 'W3Docs' devient "W3Docs".
Les guillemets doubles doivent également être utilisés pour les noms de propriétés d'objet. C'est obligatoire. Par exemple, booksCount : 4 deviendra "booksCount": 4.

Vous pouvez appliquer la méthode JSON.stringify aux primitives également. Elle supporte les types de données suivants :

Tableaux [ ... ]
Objets { ... }
Primitives (nombres, chaînes de caractères, valeurs booléennes et null).

Voici un exemple :

JSON stringify in javascript

1
2
3
4
5
6
// a JSON number is an ordinary number
console.log(JSON.stringify(10)) // 10 
// a JSON string is a double-quoted string
console.log(JSON.stringify([1, 2, 3])); // [1,2,3]
console.log(JSON.stringify(false)); // false
console.log(JSON.stringify('W3Docs')) // "W3Docs"
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Notez que JSON.stringify ignore plusieurs objets spécifiques à JavaScript, tels que les propriétés des fonctions (méthodes), les propriétés symboliques et les propriétés stockant undefined.

Examinons le cas suivant :

JSON stringify in javascript

1
2
3
4
5
6
7
8
let site = {
  welcome() { // ignore
    console.log("Welcome");
  },
  [Symbol("id")]: 10, // ignore
  someProperty: undefined // ignore
};
console.log(JSON.stringify(site)); // {} - empty object
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Le meilleur dans tout cela est que les objets imbriqués sont automatiquement pris en charge et convertis.

Par exemple :

JSON stringify with nested objects javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
let site = {
  name: "W3Docs",
  books: {
    booksCount: 4,
    booksTitle: ["html", "css", "js", "git"]
  }
}; 
console.log(JSON.stringify(site));
/* The whole structure is stringified:
{
  "name":"W3Docs",
  "book":{"booksCount":4,"booksTitle":["html","css", "js", "git"]},
}
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Mais il y a aussi une limitation essentielle : vous ne devez pas utiliser de références circulaires.

Par exemple :

Javascript json stringify objects not use circular references

1
2
3
4
5
6
7
8
9
10
let books = {
  booksCount: 4
};
let site = {
  name: "W3Docs",
  booksTitle: ["html", "css", "js", "git"]
};
site.tutorial = books; // site references books
books.canUse = site; // books references site
console.log(JSON.stringify(site)); // Error: Converting circular structure to JSON
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Exclusion et Transformation : replacer

Pour JSON.stringify la syntaxe complète suivante est utilisée :

let json = JSON.stringify(value[, replacer, space])

Il a trois arguments :

la valeur : une valeur pour l'encodage;
le replacer : le tableau des propriétés pour l'encodage ou une fonction de mappage function(key, value);;
l'espace : quantité d'espace utilisée pour la mise en forme.

JSON.stringify utilise le plus souvent le premier argument. Mais si vous souhaitez améliorer votre processus de remplacement, vous pouvez également utiliser le second argument. Si un tableau de propriétés lui est passé, seules ces propriétés sont encodées.

Examinons un exemple :

JSON stringify in javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
let books = {
  booksCount: 4
};
let site = {
  name: "W3Docs",
  booksTitle: [{
    title: "html"
  }, {
    title: "css"
  }, {
    title: "js"
  }, {
    title: "git"
  }],
  tutorial: books // tutorial references books
};
books.canUse = site; // books references site
console.log(JSON.stringify(site, ['name', 'booksTitle']));
// {"name":"W3Docs","booksTitle":[{},{},{},{}]}
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

JSON stringify javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
let books = {
  booksCount: 4
};
let site = {
  name: "W3Docs",
booksTitle: [{
    title: "html"
  }, {
    title: "css"
  }, {
    title: "js"
  }, {
    title: "git"
  }], 
  tutorial: books // site references books
};
books.canUse = site; //books references site 
console.log(JSON.stringify(site, ['name', 'booksTitle', 'tutorial', 'title', 'booksCount']));
/*
{
  "name":"W3Docs",
  "booksTitle":[{"title":"html"},{"title":"css"}, {"title":"js"}, {"title":"git"}],
  "tutorial":{"booksCount":4}
}
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Maintenant, essayons d'ajouter à la liste toutes les propriétés, à l'exception de books.free :

Comme vous pouvez le voir, tout est sérialisé, sauf canUse. Vous pouvez également remarquer que la liste donnée semble plutôt longue. Heureusement, la fonction replacer peut être appelée. Vous pouvez l'appeler pour chaque paire key, value, et la valeur "remplacée" peut être renvoyée. Vous pouvez l'utiliser à la place de la valeur originale. Pour ignorer canUse, undefined est renvoyé dans l'exemple ci-dessous :

JSON stringify in javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
let books = {
  booksCount: 4
};
let site = {
  name: "W3Docs",
  booksTitle: [{
    title: "html"
  }, {
    title: "css"
  }, {
    title: "js"
  }, {
    title: "git"
  }],
  tutorial: books // site references books
};
books.canUse = site; // books references site
console.log(JSON.stringify(site, function replacer(key, value) {
  console.log(`${key}: ${value}`);
  return (key == 'canUse') ? undefined : value;
}));
/* key:value pairs that come to replacer:
:             [object Object]
name:        W3Docs
booksTitle: [object Object],[object Object],[object Object],[object Object]
0:            [object Object]
title:         html
1:            [object Object]
title:         css
2:            [object Object]
title:         js
3:            [object Object]
title:         git
tutorial:        [object Object]
booksCount:       4
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Notez que la fonction replacer reçoit toute paire clé/valeur avec les éléments de tableau et les objets imbriqués.

Formatage : espace

Comme mentionné précédemment, JSON.stringify a trois arguments. Le troisième est le nombre d'espaces utilisés pour le formatage. Généralement, les développeurs utilisent l'argument space pour obtenir une sortie excellente.

Le space = 2 ordonne à JavaScript d'afficher les objets imbriqués sur différentes lignes avec une indentation de deux espaces à l'intérieur d'un objet.

Par exemple :

JSON stringify javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
let user = {
  name: "Maria",
  age: 23,
  roles: {
    isAdmin: true,
    isContentWriter: false
  }
};
console.log(JSON.stringify(user, null, 2));
/* two-space indents:
{
  "name": "Maria",
  "age": 23,
  "roles": {
    "isAdmin": true,
    "isContentWriter": false
  }
}
*/
/* for JSON.stringify(user, null, 2) the result would be more indented:
{
  name: "Maria",
  age: 23,
  roles: {
    isAdmin: true,
    isContentWriter: false
  }
};
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"toJSON" personnalisé

En règle générale, un objet peut fournir la méthode toJSON pour implémenter la conversion to-JSON. Si elle est disponible, JSON.stringify l'appelle automatiquement.

Voici un exemple :

JSON stringify javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let books = {
  booksCount: 4
};  
let site = {
  name: "W3Docs",
  update: new Date(Date.UTC(2020, 1, 2)),
  books
}; 
console.log(JSON.stringify(site));
/*
  {
    "name":"W3Docs",
    "update":"2020-02-02T00:00:00.000Z",  // (1)
    "books": {"booksCount":4 }              // (2)
  }
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Dans le cas ci-dessus, update (1) est transformé en une chaîne. La raison en est que toutes les dates ont une méthode toJSON intégrée.

Si vous ajoutez un toJSON personnalisé pour l'objet books (2), il ressemblera à ceci :

toJSON in javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
let books = {
  booksCount: 4,
  toJSON() {
    return this.booksCount;
  }
}; 
let site = {
  name: "W3Docs",
  books
}; 
console.log(JSON.stringify(books)); // 4 
console.log(JSON.stringify(site));
/*
  {
    "name":"W3Docs",
    "books": 4
  }
*/
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

JSON.parse

Pour décoder une chaîne JSON, une autre méthode est utilisée, appelée JSON.parse avec la syntaxe suivante :

let value = JSON.parse(str, [reviver]);

JSON est quelque peu compliqué : les objets et les tableaux peuvent inclure d'autres objets et tableaux. Mais il est obligatoire de respecter le format du JSON.

Vous trouverez ci-dessous les erreurs typiques dans du JSON écrit à la main :

let json = `{
  welcome: "Welcome",                     // mistake: property name without quotes
  "site": 'W3Docs',               // mistake: single quotes in value (must be double)
  'hasAdmin': true                  // mistake: single quotes in key (must be double)
  "update": new Date(2000, 2, 3), // mistake: no "new" is allowed, only bare values
  "books": [1, 2, 3, 4]              // here all fine
}`;

De plus, notez que JSON ne permet pas de commenter. Si vous ajoutez un commentaire, vous le rendrez invalide. Il existe un format spécifique JSON, qui prend en charge les clés non citées, les commentaires, et plus encore.

Résumé

JSON représente un format de données avec une norme indépendante et des bibliothèques pour la majorité des langages de programmation. Il prend en charge les tableaux, les chaînes de caractères, les objets, les booléens, les nombres, et null.

JavaScript a les méthodes JSON.stringify pour la sérialisation en JSON et JSON.parse pour la lecture à partir de JSON. Dans le cas où un objet a toJSON, vous devez l'appeler par JSON.stringify..

Heure du Quiz : Testez Vos Compétences!

Prêt à relever le défi de ce que vous avez appris ? Plongez dans nos quiz interactifs pour approfondir votre compréhension et renforcer vos connaissances de manière ludique.