JSON formátovač

Co je formátování JSON?

Formátování JSON je proces převedení JSON dat do konzistentního, snadno čitelného formátu přidáním odsazení, mezer a zalomení řádků – bez změny struktury nebo obsahu. Správné formátování usnadňuje kontrolu, ladění, sdílení a úpravy JSON, při zachování kompatibility s programy a nástroji.

JSON ze své podstaty ignoruje mezery mimo hodnot řetězců. Ovšem špatně naformátovaný (nebo zminifikovaný) JSON – bez odsazení nebo zhuštěný do jednoho řádku – je pro člověka téměř nečitelný a obtížně upravitelný.

Formátování vs. Zmenšování JSON

• Formátování přidává mezery, odsazení a zalomení řádků pro lepší přehlednost a čitelnost.
• Zmenšování odstraňuje veškeré nepotřebné mezery pro maximální kompaktnost a efektivitu při ukládání nebo přenosu.
• Kvalitní JSON formátovač umožňuje snadno přepínat mezi těmito režimy, takže můžete rychle přepnout mezi verzí přátelskou k lidem a optimalizovanou verzí pro stroje.

Příklad: Zminifikovaný vs. Formátovaný JSON

{"id":"3f4b2c","user":{"name":"Dana","is_active":true},"roles":["admin","editor"],"count":7}

{
  "id": "3f4b2c",
  "user": {
    "name": "Dana",
    "is_active": true
  },
  "roles": [
    "admin",
    "editor"
  ],
  "count": 7
}

Proč formátovat JSON?

• Čitelnost: Správné odsazení a zalomení řádků usnadňuje kontrolu vnořených objektů, odhalování chyb a rychlé pochopení složitých datových struktur.
• Ladění: Řešení neplatných nebo neočekávaných dat je jednodušší, když můžete vizuálně sledovat klíče, hodnoty a úrovně vnoření.
• Spolupráce: Dobře naformátovaný JSON se snáze kontroluje, diskutuje a upravuje během revizí kódu, dokumentace nebo společných souborů.
• Správa verzí: Git a další nástroje VCS vytváří smysluplnější rozdíly u formátovaného JSON, což usnadňuje sledování změn v čase.
• Shoda s pravidly: Mnoho stylových příruček a automatických linterů (jako Prettier, ESLint nebo jq) vyžaduje konzistentní formátování pro přehlednost a standardizaci.
• Kompatibilita nástrojů: Některé API, příkazové řádky a editory očekávají formátovaný vstup pro snadnější lidskou interakci nebo logování.

Jak funguje JSON formátovač?

1. Parsování: Formátovač nejprve zkusí načíst váš vstup jako JSON pomocí přísného parseru. Tímto se ověřuje syntax a odhalují chyby jako chybějící uvozovky, poslední čárky nebo neescapované znaky.
2. Pěkné vytištění: Jakmile je JSON platný, data se převedou zpět na textový řetězec s uživatelem zvoleným odsazením (obvykle 2 nebo 4 mezery) a zalomením řádků tak, aby vznikla pěkně naformátovaná verze.

Pokud vstup není platný JSON, formátovač vyhodí chybu nebo zobrazí užitečnou zprávu s místem a povahou problému.

Možnosti formátování

• Odsazení: Nastavte počet mezer na jednu úroveň (max. 8).
• Seřadit klíče objektu abecedně
• Použít tabulátory místo mezer pro odsazení
• Zabezpečit ne-ASCII znaky jako Unicode
• Minimalizovat výstup (vše na jeden řádek bez mezer)

Běžné problémy vyřešené formátováním

• Jednořádkový/minifikovaný JSON: Data z API či logů jsou často zkomprimovaná kvůli úspoře přenosu, což komplikuje ruční úpravy. Formátování obnoví čitelnost pro kontrolu a editaci.
• Nekonzistentní odsazení: JSON z různých zdrojů může obsahovat smíšené tabulátory, mezery nebo různou hloubku odsazení. Přeformátování sjednotí tyto rozdíly a zlepší přehlednost.
• Velké/vnořené struktury: Hluboce vnořené pole nebo objekty (např. konfigurační soubory nebo složité odpovědi API) jsou přehlednější a snáze ovladatelné, pokud jsou naformátované s možností složení v podporovaných editorech.

Praktický příklad: Formátování odpovědí API

Při integraci s třetími stranami, jako jsou AWS, Stripe nebo Google Cloud, jsou odpovědi často zhuštěné pro rychlost. Formátování JSON výstupu usnadňuje kontrolu chybějících polí, ladění neočekávaných hodnot a sdílení s týmem.

{"amount":2500,"currency":"usd","status":"succeeded","charges":[{"id":"ch_1Gq","amount":2500}]}

{
  "amount": 2500,
  "currency": "usd",
  "status": "succeeded",
  "charges": [
    {
      "id": "ch_1Gq",
      "amount": 2500
    }
  ]
}

Jak s tímto nástrojem formátovat JSON

1. Vložte nebo nahrajte svůj surový, minifikovaný nebo špatně formátovaný JSON do vstupního pole.
2. Vyberte možnosti formátování (velikost odsazení, řazení klíčů atd.).
3. Klikněte na "Formátovat" pro zpracování vašeho vstupu.
4. Zobrazte nebo zkopírujte čistý a čitelný výstup. Pokud jsou nalezeny chyby, zobrazí se podrobné zprávy o syntaxi, které vám pomohou JSON opravit.

Veškeré formátování probíhá bezpečně ve vašem prohlížeči – vaše data nikdy neopouštějí vaše zařízení.

Ukázky kódu pro formátování JSON

Podívejte se, jak formátovat JSON v různých programovacích jazycích. Tyto příklady ukazují základní techniky formátování pro lepší přehlednost a optimalizaci kódu.

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

import json
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = json.dumps(json.loads(ugly), indent=2)
print(pretty)

package main
import (
  "encoding/json"
  "fmt"
)
func main() {
  ugly := []byte(`{"name":"Alice","age":30,"roles":["admin","user"]}`)
  var obj interface{}
  json.Unmarshal(ugly, &obj)
  pretty, _ := json.MarshalIndent(obj, "", "  ")
  fmt.Println(string(pretty))
}

import com.fasterxml.jackson.databind.ObjectMapper;
public class Main {
  public static void main(String[] args) throws Exception {
    String ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    ObjectMapper mapper = new ObjectMapper();
    Object obj = mapper.readValue(ugly, Object.class);
    String pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj);
    System.out.println(pretty);
  }
}

using System;
using Newtonsoft.Json;
class Program {
  static void Main() {
    var ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    var parsed = JsonConvert.DeserializeObject(ugly);
    var pretty = JsonConvert.SerializeObject(parsed, Formatting.Indented);
    Console.WriteLine(pretty);
  }
}

<?php
$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
$obj = json_decode($ugly);
echo json_encode($obj, JSON_PRETTY_PRINT);

require 'json'
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = JSON.pretty_generate(JSON.parse(ugly))
puts pretty

echo '{"name":"Alice","age":30,"roles":["admin","user"]}' | jq .

fn main() {
  let ugly = r#"{"name":"Alice","age":30,"roles":["admin","user"]}"#;
  let value: serde_json::Value = serde_json::from_str(ugly).unwrap();
  let pretty = serde_json::to_string_pretty(&value).unwrap();
  println!("{}", pretty);
}

import com.fasterxml.jackson.databind.ObjectMapper
fun main() {
  val ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}"
  val mapper = ObjectMapper()
  val obj = mapper.readValue(ugly, Any::class.java)
  val pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj)
  println(pretty)
}

import Foundation
let ugly = "{\"name\":\"Alice\",\"age\":30,\"roles\":[\"admin\",\"user\"]}"
if let data = ugly.data(using: .utf8),
   let obj = try? JSONSerialization.jsonObject(with: data),
   let pretty = try? JSONSerialization.data(withJSONObject: obj, options: .prettyPrinted),
   let prettyString = String(data: pretty, encoding: .utf8) {
    print(prettyString)
}

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

SELECT jsonb_pretty('{"name":"Alice","age":30,"roles":["admin","user"]}'::jsonb);

SELECT JSON_PRETTY('{"name":"Alice","age":30,"roles":["admin","user"]}');

$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
$obj = $ugly | ConvertFrom-Json
$pretty = $obj | ConvertTo-Json -Depth 10
Write-Output $pretty

use JSON;
my $ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
my $obj = decode_json($ugly);
print to_json($obj, { pretty => 1 });

import 'dart:convert';
void main() {
  const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
  final obj = jsonDecode(ugly);
  final pretty = JsonEncoder.withIndent('  ').convert(obj);
  print(pretty);
}

ugly = ~s({"name":"Alice","age":30,"roles":["admin","user"]})
{:ok, obj} = Jason.decode(ugly)
pretty = Jason.encode!(obj, pretty: true)
IO.puts(pretty)

import play.api.libs.json._
object Main extends App {
  val ugly = """{"name":"Alice","age":30,"roles":["admin","user"]}"""
  val jsValue = Json.parse(ugly)
  val pretty = Json.prettyPrint(jsValue)
  println(pretty)
}