JSON – formát a online nástroje

Zkratka JSON znamená JavaScript Object Notation – česky by se dala přeložit třeba jako styl zápisu JavaScriptového objektu. Z toho plyne, že má něco společného s JS, ale v dnešní době se používá jako universální strojově čitelný formát pro výměnu dat.

Hlavní výhody JSONu:

• Čitelnost – na rozdíl od XML je kompaktnější a přehlednější
• Snadné zpracování – nativní podpora ve všech moderních jazycích
• Universálnost – standard pro REST API, konfigurační soubory, databáze

Syntaxe JSON

JSON podporuje následující datové typy:

• Objekt – {} kolekce párů klíč-hodnota
• Pole – [] uspořádaný seznam hodnot
• Řetězec – text v dvojitých uvozovkách "text"
• Číslo – integer nebo float 42, 3.14
• Boolean – true nebo false
• Null – null

Objekt

Objekt je ve složených závorkách a jednotlivé dvojice „klíč : hodnota" se oddělují čárkou:

{
  "jmeno": "Jan Novák",
  "vek": 30,
  "email": "jan@example.com"
}

Zanořování dat

Do klíče jde kromě hodnoty přiřadit další objekt:

{
  "uzivatel": {
    "jmeno": "Jan",
    "adresa": {
      "mesto": "Praha",
      "psc": "11000"
    }
  }
}

Pole

Přísluší-li k jednomu klíči více položek, používají se hranaté závorky []:

{
  "uzivatele": [
    { "jmeno": "Jan", "vek": 30 },
    { "jmeno": "Eva", "vek": 25 }
  ]
}

Data z pole se dostanou pomocí číselného indexu (od nuly):

data.uzivatele[0].jmeno // "Jan"

JSON v JavaScriptu

JavaScript má dva základní nástroje pro práci s JSON:

JSON.parse()

Převede textový řetězec na JavaScript objekt:

const text = '{"jmeno": "Jan", "vek": 30}';
const obj = JSON.parse(text);
console.log(obj.jmeno); // "Jan"

JSON.stringify()

Převede JavaScript objekt na textový řetězec:

const obj = { jmeno: "Jan", vek: 30 };
const text = JSON.stringify(obj);
// '{"jmeno":"Jan","vek":30}'

// S formátováním (2 mezery odsazení)
const pretty = JSON.stringify(obj, null, 2);

Načtení JSON z API

Moderní způsob načtení JSON dat ze serveru pomocí fetch:

// Async/await
const response = await fetch('/api/data.json');
const data = await response.json();

// Promises
fetch('/api/data.json')
  .then(response => response.json())
  .then(data => console.log(data));

JSON v TypeScriptu

TypeScript umožňuje definovat typy pro JSON data:

interface User {
  jmeno: string;
  vek: number;
  email?: string; // volitelná položka
}

const data: User = JSON.parse(jsonText);

// Typově bezpečná funkce
function parseUser(json: string): User {
  return JSON.parse(json) as User;
}

Pro runtime validaci se hodí knihovny jako Zod nebo Valibot.

JSON v PHP

PHP má pro práci s JSON dvě hlavní funkce:

<?php
// Dekódování JSON → PHP
$json = '{"jmeno": "Jan", "vek": 30}';
$obj = json_decode($json);        // objekt
$arr = json_decode($json, true);  // asociativní pole

echo $obj->jmeno;  // "Jan"
echo $arr['jmeno']; // "Jan"

// Enkódování PHP → JSON
$data = ['jmeno' => 'Jan', 'vek' => 30];
$json = json_encode($data);
$pretty = json_encode($data, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);

Flag JSON_UNESCAPED_UNICODE zajistí správné zobrazení českých znaků.

JSON v Pythonu

import json

# Parsování
data = json.loads('{"jmeno": "Jan", "vek": 30}')
print(data["jmeno"])  # Jan

# Ze souboru
with open("data.json", "r", encoding="utf-8") as f:
    data = json.load(f)

# Serialisace
text = json.dumps(data, ensure_ascii=False, indent=2)

JSON vs. JavaScript objekt

Objekt v JavaScriptu vypadá podobně jako JSON, ale existují rozdíly:

Vlastnost	JSON	JS objekt
Klíče	Musí být v "dvojitých uvozovkách"	Mohou být bez uvozovek
Řetězce	Pouze "dvojité uvozovky"	Jednoduché i dvojité
Trailing comma	Zakázána	Povolena
Komentáře	Nepodporuje	Podporuje
Funkce	Nepodporuje	Podporuje

JSON s komentáři (JSONC)

Standardní JSON nepodporuje komentáře. Pro konfigurační soubory existuje JSONC (JSON with Comments), který používá např. VS Code pro settings.json:

{
  // Toto je komentář
  "editor.fontSize": 14,
  /* Víceřádkový
     komentář */
  "editor.tabSize": 2
}

JSONC není standardní JSON a vyžaduje speciální parser.

JSON5

JSON5 je rozšíření JSONu, které přidává:

• Komentáře (// a /* */)
• Trailing commas
• Klíče bez uvozovek
• Jednoduché uvozovky pro řetězce
• Víceřádkové řetězce

{
  // Konfigurace
  name: 'Projekt',
  version: 1,
  features: [
    'feature1',
    'feature2', // trailing comma OK
  ],
}

Kde se JSON používá

• REST API – standardní formát pro komunikaci frontend-backend
• Konfigurační soubory – package.json, tsconfig.json, VS Code settings
• NoSQL databáze – MongoDB, CouchDB, Firebase
• Web Storage – localStorage, sessionStorage (s JSON.stringify)
• JWT tokeny – payload je JSON zakódovaný v Base64

JSONP (zastaralé)

JSONP je „JSON s vycpávkou" (písmeno P značí padding). Používal se v situacích, kdy bylo potřeba získat JavaScriptem data z cizí domény, protože AJAX byl omezen na stejnou doménu.

Dnes je JSONP nahrazen technologií CORS, která umožňuje bezpečnější cross-origin požadavky.

JSONP fungoval tak, že server vracel data obalená do volání JS funkce:

// Server vrací:
callback({"jmeno": "Jan", "vek": 30});

// Klient definuje funkci:
function callback(data) {
  console.log(data.jmeno);
}

Nevýhoda JSONP byla bezpečnostní – připojoval se cizí skript, který mohl manipulovat se stránkou.

Tipy pro práci s JSON

• Používejte konsistentní pojmenování klíčů (camelCase nebo snake_case)
• Pro velká data zvažte streaming parsery (např. JSONStream pro Node.js)
• Validujte vstupní JSON pomocí JSON Schema
• Pro binární data použijte Base64 encoding
• Při API komunikaci nastavte Content-Type: application/json

Online nástroje