JavaScript Pretty Print JSON

1. Utilisez JSON.stringify() pour Pretty Print JSON en JavaScript
2. Mettez en surbrillance la syntaxe JSON
3. Utilisez JSON.parse() pour Pretty Print JSON en JavaScript
4. Utiliser un tableau JSON

Cet article explique comment imprimer JSON en JavaScript.

Utilisez JSON.stringify() pour Pretty Print JSON en JavaScript

L’argument JSON.stringify() permet d’afficher le contenu en joli print et permet à l’utilisateur de définir l’espacement qui convient à sa lisibilité.

Vous pouvez le faire en définissant une variable de chaîne comme suit.

var prettyString = JSON.stringify(obj, null, 2);  // spacing level = 1.5

Mettez en surbrillance la syntaxe JSON

Si vous devez mettre en évidence une syntaxe JSON, vous devez créer une fonction et inclure du code regex.

function prettyString(json) {
  if (typeof json != 'string') {
    json = JSON.stringify(json, undefined, 2);
  }
  json =
      json.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
  return json.replace(
      /("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g,
      function(match) {
        var str1 = 'number';
        if (/^"/.test(match)) {
          if (/:$/.test(match)) {
            str1 = 'key';
          } else {
            str1 = 'string';
          }
        } else if (/true|false/.test(match)) {
          str1 = 'boolean';
        } else if (/null/.test(match)) {
          str1 = 'null';
        }
        return '<span class="' + str1 + '">' + match + '</span>';
      });
}

Utilisez JSON.parse() pour Pretty Print JSON en JavaScript

La méthode ci-dessus utilise json.stringify() et fonctionne très bien sur les objets JSON, mais pas sur les chaînes JSON. Pour donner une jolie impression d’une chaîne JSON, vous devrez d’abord la convertir en objet.

var string1 = '{"program":"code"}';
var prettyPrint = JSON.stringify(JSON.parse(string1), null, 2);

Assurez-vous d’encapsuler la chaîne dans les balises HTML <pre> et </pre> pour qu’elle s’affiche correctement.

Utiliser un tableau JSON

Vous pouvez également utiliser un tableau JSON en JavaScript. C’est simple et ne nécessite pas de calcul supplémentaire, ce qui pourrait ralentir le programme, surtout s’il est répété plusieurs fois.

Par exemple:

JSON.stringify(jsonobj, null, '\t')

Cela devrait également être utilisé dans les balises <pre> et </pre>.